10個最常用的CSS className

2021-08-24 18:29:03 字數 1257 閱讀 1028

很多做前端開發的在為頁面元素定class的時候經常會拿不定主意,導致隨意使用class,乙個好的class要能夠描述出某個特定元素的表現, 在符合團隊開發流程、規範的情況下也要注意在工作中形成一套自己的風格,下面是我最經常使用的個人認為命名比較恰當和有一定作用的10個class。

1.class=」fixed」

fixed這個class幾乎出現在沒個樣式檔案中,用在為包含浮動子元素的容器元素清除浮動,樣式如下

以下為引用的內容:

.fixed:after

.fixed

/* */

.fixed

* html .fixed

這個樣式就可以用在下面的情形,每個li都是浮動的:

以下為引用的內容:

2.class=」alt」

以下為引用的內容:

#content img

#content img.alt

3.class=」selected」

這個最經常用的,用來處理mouseover或選中元素的效果。

以下為引用的內容:

about us

4.class=」first」, class=」last」

直到99.9% 的瀏覽器支援:first-child和:last-child這兩個偽類之前,class=」first」, class=」last」用的地方還是很多的。

5.class=」image」

平常選擇元素一般用類似(#container img)這樣的標籤選擇器,但是我這裡的class=」image」是用在包含的容器元素,假如你正在做乙個新聞列表,需要在新聞標題下面加一行帶和說明文字,並且向右浮動,可以這樣做:

以下為引用的內容:

this is me trying to look cool!

the rest of the content here

...

6. class=」inner」

7.class=」link」

以下為引用的內容:

read more...

8.class=」one」, class=」two」, class=」three」…

以下為引用的內容:

9.class=」even」, class=」odd」

用來實現隔行換樣式,一般用在**和列表:

以下為引用的內容:

10.class=」section」

一般用在為指定內容中特定部分新增特定的樣式:

以下為引用的內容:

content here...

統計最常用10個命令的指令碼

某同學遇到個需求 開發乙個指令碼 可以統計出最長用的10個命令 輸出有4列,序號 1 10 數量 大 小 佔比 大 小 命令 效果如下 改寫後的指令碼 bin bash cat bash history awk end for k in list sort nrk 1 head n 10 awk h...

ubuntu最常用的10個快捷鍵

u buntu 是當前最流行的linux發行版之一,使用u buntu 除了經常使用的ctrl c 複製 and ctrl v 粘帖 其實還有一些不常用但很有用的 ubuntu快捷鍵。如果你現在正蒐羅更多的u buntu 快捷鍵,相信你可以在這裡找到一些新的。ctrl alt d快捷鍵讓你很快地最小...

10組最常用Git命令

10組最常用git命令 更多 一般來說,日常使用只要記住下圖6個命令,就可以了。但是熟練使用,恐怕要記住60 100個命令。下面是我整理的常用 git 命令清單。幾個專用名詞的譯名如下。workspace 工作區 index stage 暫存區 repository 倉庫區 或本地倉庫 remote...