摘要:圖標跟文字混排分享截圖注意父容器的值與圖標的高度相等,另保持設置圖標的的值為。上下垂直居中,需要兼容低版本的瀏覽器時用比用要好很多。
1、圖標跟文字混排
html
分享
css
.link{ width: 92px; border: 1px solid #0f0; line-height: 18px; } .icon{ display: inline-block; *zoom: 1; vertical-align: bottom; } .wyyx{ width: 18px; height: 18px; background: url(http://p2.qhimg.com/t0116804ffa3cc8a59f.png) no-repeat; }
截圖:
注意:
父容器的line-height值與圖標的高度相等,另保持設置圖標的vertical-align的值為bottom。
2、上下垂直居中,需要兼容低版本的瀏覽器時用padding比用line-height要好很多。
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/111101.html
摘要:現在回到我們這一章節的標題,將它做下補充關于那些事四之基于構架基礎樣式庫基礎庫構思為什么要做基礎庫我上一章節的末尾拋出了幾個問題假設你要做一個游戲單頁面,網頁上并不存在表單內容,那么你就要移除一些冗余的代碼,開始自定義樣式來滿足自己的需求。 前言 先來回顧一下前幾章節,我們都說了哪些內容: CSS Reset 歷史 與 Normalize.css 介紹 Normalize.css...
摘要:現在回到我們這一章節的標題,將它做下補充關于那些事四之基于構架基礎樣式庫基礎庫構思為什么要做基礎庫我上一章節的末尾拋出了幾個問題假設你要做一個游戲單頁面,網頁上并不存在表單內容,那么你就要移除一些冗余的代碼,開始自定義樣式來滿足自己的需求。 前言 先來回顧一下前幾章節,我們都說了哪些內容: CSS Reset 歷史 與 Normalize.css 介紹 Normalize.css...
摘要:一個叫的人用純重繪并模擬了種不同的移動設備包括可以給你的網站添加不相關的獨立組件的一個庫。每一個組件都是針對移動設備定制的,并且它有很多你在傳統的框架中看不到的功能。如果你用開發移動優先的網站,并想要網站正常運行在低版本的上,可以考慮。 眾所周知,CSS是非常棒的,它使網站看起來很漂亮,可以為網站添加動畫,并讓呈現和內容分離。去了解CSS的一切是非常難做到的,它只會變得更加困難,因為我...
閱讀 2831·2023-04-26 02:23
閱讀 1570·2021-11-11 16:55
閱讀 3149·2021-10-19 11:47
閱讀 3352·2021-09-22 15:15
閱讀 1975·2019-08-30 15:55
閱讀 1033·2019-08-29 15:43
閱讀 1288·2019-08-29 13:16
閱讀 2188·2019-08-29 12:38