色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

css字再圖片中間

錢良釵2年前12瀏覽0評論

CSS可以讓我們輕松地在圖片中間放置字體,這個功能非常實用,可以讓我們更好地進行設計。

img {
display: block;
margin: auto;
}
img::before {
content: "";
display: inline-block;
height: 100%;
vertical-align: middle;
}
p {
display: inline-block;
vertical-align: middle;
}

首先,我們需要讓圖片居中顯示,可以用以下代碼實現:

img {
display: block;
margin: auto;
}

接著,我們需要在圖片的前面插入一個偽元素,在它的content屬性中輸入一個空字符串,這個偽元素將被放置在圖片的前面。

img::before {
content: "";
display: inline-block;
height: 100%;
vertical-align: middle;
}

我們在偽元素中設置了display:inline-block,它可以讓元素像行內元素一樣描述,同時又可以設置寬、高等屬性。height:100%與圖片高度相同,并且vertical-align:middle讓元素垂直居中。

現在,我們可以在圖片后插入一個段落元素,使用以下代碼:

p {
display: inline-block;
vertical-align: middle;
}

我們設置了display:inline-block,它可以讓元素像行內元素一樣描述,同時又可以設置寬、高等屬性。vertical-align:middle讓元素垂直居中。

現在,我們已經完成在圖片中間放置字體的過程,非常方便實用。