行內元素設定margin 0 auto無效的問題

2021-09-27 09:12:14 字數 293 閱讀 9609

行內元素指的是可在同一行內排列的元素,列舉幾個常用行內元素:img、input、span、label、a、textarea、button。

通常要給元素設定居中得效果的話,很多人會先想到margin: 0 auto;可當用這種方法給行內元素設定時,行內元素沒有呈現我們想要得居中效果,以下為解決方案(行內元素寬度給不給都可以)。

方法二:先將行內元素設定為塊級(display:block;)元素,再設定margin:0 auto;

方法三:將包裹行內元素的父元素寫入我們常給文字居中的**(text-align:center;)

行內元素和margin疊加問題

行內元素正常狀態 行內元素設定寬高沒效,width 100px height 1000px 行內元素設定margin top,margin bottom無效,margin left,margin right有效 行內元素設定line height 100px 有效 行內元素變成塊狀,display ...

行內元素屬性設定

行內元素同樣具有盒子模型,那麼就可以給行內元素設定不同的 css 屬性,比如寬度 高度 內邊距和外邊距,那麼行內元素是否需要設定這些屬性呢?給行內元素設定寬度和高度是無效的 span1 span1 行內元素設定寬度和高度 複製 此時我們通過觀察頁面以及盒子的渲染出來的模型,可以發現 即使給行內元素設...

行內和塊級元素區別 如何讓行內元素設定寬高

1.行內元素與塊級函式可以相互轉換,通過修改display屬性值來切換塊級元素和行內元素,行內元素display inline,塊級元素display block。2.行內元素和其他行內元素都會在一條水平線上排列,都是在同一行的 塊級元素卻總是會在新的一行開始排列,各個塊級元素獨佔一行,垂直向下排列...