css-层次选择器
一、后代選擇器
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Title</title><style>/* 后代選擇器 */body ul p{background: red;}body p{background: yellow;}</style> </head> <body><p>p1</p><p>p2</p><p>p3</p><ul><li><p>p4</p></li><li><p>p5</p></li><li><p>p6</p></li></ul> </body> </html>二、子選擇器
/* 子選擇器 */ body>p{background: #12ec4e; }三、相鄰兄弟選擇器–向下選擇第一個
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Title</title><style>/* 相鄰兄弟選擇器： 只有一個，對下不對上 */.active + p{background: green;}</style> </head> <body><p class="active">p1</p><p>p2</p><p>p3</p><ul><li><p>p4</p></li><li><p>p5</p></li><li><p>p6</p></li></ul> </body> </html>四、通用兄弟選擇器
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Title</title><style>/* 通用兄弟選擇器，當前選中元素的向下的所有兄弟元素 */.active~p{background: red;}</style> </head> <body><p class="active">p1</p><p>p2</p><p>p3</p><ul><li><p>p4</p></li><li><p>p5</p></li><li><p>p6</p></li></ul><p>p7</p> </body> </html>https://www.bilibili.com/video/BV1YJ411a7dy?p=6
總結
- 上一篇： Excel 数据导入到Access数据库
- 下一篇： Access中编写VBA代码时，如何区分