Ex:Bakery3:元素位置排列

範例結果

主題:元素位置排列

  1.  方法1:麻將牌桌法:
    • float
  2. 方法2:父子關係精準定位法:
    • position
  3. 方法3:推來推去擺放法:
    • display:inline-block
    • 結合padding及margin

 

元素位置排列方法1:float:麻將牌桌法

重要參考連結:

  1. clear解除 float 屬性
  2. overflow 屬性用法讓你掌握控制捲軸效果
  3. 子區塊float造成的困擾

練習1:section2 蛋糕小秘訣 中,杯子蛋糕種類

html結構

CSS美化