1.父子元素position定位改變子元素位置
子元素的css
position:absolute/fixed;
top:0;right:0;bottom:0;left:0;
margin:auto
好處在於此方法不用知道元素寬高
position:absolute/fixed;
top:50%;right:50%;bottom:50%;left:50%;
之後再通過使用margin減去自身長寬
margin:auto
該方法需要知道元素的寬高
position:absolute/fixed;
top:50%;right:50%;bottom:50%;left:50%;
之後再通過使用transform translatex/y()減去自身長寬
transform:translatex/y(-50%)
margin:auto
也不用知道子元素長寬
CSS塊級元素 內聯元素
在css盒子模型中，我們提到了html元素中的塊元素 block element 和內聯元素 inline element 那麼它們究竟是什麼呢？其實，這兩種元素都是html規範中的概念。塊元素 block element 一般是其他元素的容器元素，能容納其他塊元素或內聯元素。最常見的就是p和div...
CSS塊級元素 內聯元素
在css盒子模型中，我們提到了html元素中的塊元素 block element 和內聯元素 inline element 那麼它們究竟是什麼呢？其實，這兩種元素都是html規範中的概念。塊元素 block element 一般是其他元素的容器元素，能容納其他塊元素或內聯元素。最常見的就是p和div...
css變成塊級元素 CSS 塊級元素
完整的框模型 box model 不同的寬度 高度 內邊距和外邊距相結合，就可以確定文件的布局。大多數情況下，文件的高度和寬度由瀏覽器基於可用的顯示區域和其他一些因素自動確定。1 元素框的最內部分是實際的內容。2 直接包圍內容的是內邊距。內邊距呈現了元素的背景。內邊距的邊緣是邊框。3 邊框以外是外邊...