要實現的效果如上.3個塊級元素div,中間那個居中,其他2個靠邊.(只考慮ie8+)
對於居中的問題,有很多,包括上下左右正居中,緊貼頂部居中等.
可以嘗試先布局:
demo1
demo2
demo3
對於中間那個div可以直接寫:
#div2
#div1
#div3
#div2
然而發現效果還是不對,可以看到如下:
發現div3跟div1,div2不在同行,問題出在哪呢?
其實還是文件流的布局上.即div1,div2,div3加入的順序是要注意的.雖然div1,div3已是float,脫離文件流,不佔文件流空間.但div2還是塊級元素,依然會佔一行.
故需要修改html div引入順序.
demo1
demo3
demo2
所以這個問題,由點及面來看,還是涉及到了很多知識點,如:html文件流,塊級元素和行內元素(及其區別),盒模型.
css中塊級元素同行顯示
實現方法大概有兩種 1.設定float屬性 將塊級元素的css格式設定為float left right，比如，有兩個panel，panela和panelb，想要使其位於同一行，只需要設定a的css格式為float left right即可。注意 只是設定a的float屬性哦，若設定了b的float...
CSS的元素分類 塊級元素 行內元素 行內塊元素
在面試中有遇到一些很簡單的問題，但是比較容易忽略掉一部分，或者算是知識盲區吧 和面試官簡單的寒暄，進入正題，說說你對css元素分類的看法？根據自己認識的水平大概的講了分類，具體哪些元素，但是感覺少了點什麼又說不上來。回來查詢之後特此把知識點記錄以下 1.塊級元素 如 div,h1 h6,p,ul,l...
行內元素和塊級元素的區別，請分別寫出五個元素
1.行內元素與塊級元素直觀上的區別 二 行內元素與塊級元素的三個區別 行內元素會在一條直線上排列 預設寬度只與內容有關 都是同一行的，水平方向排列。2.塊級元素各佔據一行 預設寬度是它本身父容器的100 和父元素的寬度一致 與內容無關 垂直方向排列。塊級元素從新行開始，結束接著乙個斷行。3.塊級元素...