css如何匹配倒數第n個元素
本章節分享一段程式碼例項,它實現了使用css匹配倒數第n個元素的功能。
程式碼例項如下:
[HTML] 純文字檢視 複製程式碼<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <style type="text/css"> #box li { width: 350px; height: 25px; line-height: 25px; font-size: 12px; } #box li:nth-last-of-type(2) { color:green; } </style> </head> <body> <ul id="box"> <li>螞蟻部落歡迎您,只有努力才會有美好的未來</li> <li>每一天都是新的,必須要好好把握。</li> <li>沒有人一開始就是高手,必須要努力奮鬥。</li> <li>未來都是虛無縹緲的,只有當前是現實。</li> <li>分享和互助式進步的最大原動力</li> </ul> </body> </html>
上面的程式碼可以將第二個li元素的字型顏色設定為綠色。
:nth-last-of-type()選擇器可以參閱CSS E:nth-last-of-type(n)一章節。
相關文章
- CSS 倒數第n個li元素樣式CSS
- css匹配第n個li元素CSS
- CSS 第N個子元素樣式CSS
- CSS 倒數第二個li元素CSS
- css匹配第n個li元素程式碼例項CSS
- css匹配第n個子元素程式碼例項CSS
- CSS設定第n個li元素樣式CSS
- CSS 設定第n個li元素樣式CSS
- L1-050 倒數第N個字串 (15分)字串
- 獲取倒數第幾個元素程式碼例項
- CSS 設定從第n個開始li元素樣式CSS
- css 獲取從第n個開始,之後的所有元素CSS
- JavaScript 獲取第n個li元素JavaScript
- jQuery查詢第n個li元素jQuery
- CSS 匹配第一個li元素CSS
- jQuery在元素集合中獲取第N個元素jQuery
- CSS 匹配指定name元素CSS
- jquery獲取指定li元素後面的第n個li元素jQuery
- 獲取陣列第N個元素的方法陣列
- Leetcode No.19 刪除連結串列的倒數第N個節點LeetCode
- LeetCode- 19 刪除連結串列的倒數第N個節點LeetCode
- CSS 第2個li元素樣式CSS
- CSS 設定前n個li元素樣式CSS
- JavaScript 獲取倒數第二個li元素JavaScript
- getElementByTagName 獲取倒數第二個元素
- JavaScript獲取倒數第二個li元素JavaScript
- MySQL 分組排序後 → 如何取前N條或倒數N條MySql排序
- Nth Digit 第N個數字Git
- CSS 匹配後面所有兄弟元素CSS
- css匹配後面的所有兄弟元素CSS
- css匹配指定索引的li元素CSS索引
- CSS匹配第一個li元素程式碼例項CSS
- css匹配最後一個li元素程式碼例項CSS
- [LeetCode] Remove Nth Node From End of List 移除連結串列倒數第N個節點LeetCodeREM
- css數第二個li元素CSS
- [CareerCup] 2.2 Kth to Last Element of Linked List 連結串列的倒數第k個元素AST
- css匹配指定元素的子元素程式碼例項CSS
- leetcode每日一題—19.刪除連結串列的倒數第N個結點LeetCode每日一題