前面有一篇文章講到在css世界中,html元素的表現(xiàn)都是一個(gè)個(gè)盒子,而css中盒子的顯示方式有三種方式,分別是塊元素、行內(nèi)元素和行內(nèi)塊元素。本文總結(jié)這三種顯示方式的特征和區(qū)別。
1 寫在前面
最近在整理cnblogs上頁(yè)面的樣式,默認(rèn)右側(cè)【隨筆分類】中的標(biāo)簽是每行顯示一個(gè),而我想把右側(cè)【隨筆分類】中的標(biāo)簽設(shè)置為一行顯示多個(gè)標(biāo)簽,至于顯示多少個(gè)則隨標(biāo)簽的大小而定,并且每個(gè)標(biāo)簽在鼠標(biāo)放上去的時(shí)候會(huì)有背景顏色的變化。效果如下圖。
下面我們就來分析一下如何讓左邊的標(biāo)簽顯示方式變?yōu)橛疫呥@樣的吧
2 塊元素
在分析塊元素之前我們首先建立html網(wǎng)頁(yè),以便后面的分析。html代碼如下。
延伸閱讀
- ssh框架 2016-09-30
- 阿里移動(dòng)安全 [無(wú)線安全]玩轉(zhuǎn)無(wú)線電——不安全的藍(lán)牙鎖 2017-07-26
- 消息隊(duì)列NetMQ 原理分析4-Socket、Session、Option和Pipe 2024-03-26
- Selective Search for Object Recognition 論文筆記【圖片目標(biāo)分割】 2017-07-26
- 詞向量-LRWE模型-更好地識(shí)別反義詞同義詞 2017-07-26
- 從棧不平衡問題 理解 calling convention 2017-07-26
- php imagemagick 處理 圖片剪切、壓縮、合并、插入文本、背景色透明 2017-07-26
- Swift實(shí)現(xiàn)JSON轉(zhuǎn)Model - HandyJSON使用講解 2017-07-26
- 阿里移動(dòng)安全 Android端惡意鎖屏勒索應(yīng)用分析 2017-07-26
- 集合結(jié)合數(shù)據(jù)結(jié)構(gòu)來看看(二) 2017-07-26