css元素選擇器實訓,css選擇器中后代選擇器與子選擇器的區別?
css后代選擇器和子選擇器的區別介紹:
1 css后代選擇器語法:h1 em {color:red;} 表示的是從h1開始里面包含的所有的em元素變成紅色,h1為祖先,其他的em都是后代,即選中后代,不管是兒子還是孫子,只要是都會被選中,為后代選擇器。2、css子元素選擇器語法:h1>em{color:red;} 表示的是從h1開始里面的第一層em元素變成紅色,h1為祖先,em為兒子,就像世襲制一樣,只能傳給兒子,孫子和其他堂親都不行
html怎么控制子代的hover?
樓主,這是通過>與+來控制下個元素,子集元素,下個元素的子集元素的CSS #a {color : #FFFF00;} #a:hover > #b{color : #FF0000;} #a:hover + #c{color : #00FF00;} #a:hover + #c > #b{color : #0000FF;} 元素1 元素2 元素3 元素2 下面是補充 樓主,我又通過CSS選擇器研究了一些,你可以參考著按照自己的需求改 #a:hover {color : #FFFF00;} #a:hover > #b:first-child{color : #FF0000;} #a:hover > #b{color : #FF00FF;} #a:hover + #c{color : #00FF00;} #a:hover + #c > #b{color : #0000FF;} 元素1 元素2 元素2 元素3 元素2
為什么看到有的前端工程師將css每個選擇器里的內容寫成一行?
應該是個老程序猿,之前css壓縮沒有實現的時候,通過縮短選擇器嵌套,人工進行壓縮就出現了這個。而且沒有less,scss開發的時候這種情況更甚,不過有了這些便捷的開發方式也希望去注意一點嵌套層數。
推薦項目工程呢還是用less,scss開發比較好,css文件開發期就是被編譯的壓不壓縮無所謂了。
推薦樓主使用 vs code 這個編輯器 非常好用的東西。如果你要發展全棧或者學習node,這個玩意兒繞不開1