繼續總結過程中學到的新知識,這是第2部分。
.upperlip
.upperlip.left
.lowerlip
設定容器絕對定位:
height: 110px; /*設定框的高度,使框的高度與 相對元素底對齊*/
width: 300px;
position: absolute;
bottom: 0; /*距離相對元素下面0,即上移至 相對元素底對齊*/
left: 50%;
margin-left: -150px;
z-index: -1;
/* border: 1px solid red; */ /*設定完overflow隱藏後,注釋掉*/
overflow: hidden; /*設定隱藏超出範圍框的部分*/ }
設定內容(橢圓)絕對定位:
.lowerlip
設定鬍子(div邊框)的背景色
.upperlip
轉變思路,視為:圓弧下方,再增加乙個橢圓圓弧即可。
.lowerlip
.lowerlip::after
1 搞懂z-index的所有細節; 畫乙個皮卡丘專案小結(3)
繼續總結過程中學到的新知識,這是第3部分。預設框架樣式 引入跟隨展示效果 樣式 after body flex 1 height 50 使code部分佔高度一半 padding 10px flex 1 height 50 使效果展示部分佔高度一半 preview width 100 height 1...
畫乙個皮卡丘專案小結(2)
繼續總結過程中學到的新知識,這是第2部分。upperlip upperlip.left.lowerlip設定容器絕對定位 height 110px 設定框的高度,使框的高度與 相對元素底對齊 width 300px position absolute bottom 0 距離相對元素下面0,即上移至 ...
畫乙個皮卡丘專案小結(1)
今天開始做乙個 畫皮卡丘的專案,所以總結一下過程中學到的一些新知識。設定盒模型為 ie盒模型 after,before通過flex布局,形成絕對居中的效果 body通過相對定位和絕對定位,形成水平居中 width 100 height 165px border 1px solid red posit...