标签:
人的一生至少两件事是总不会错的,一个是多锻炼身体一个是多读书。初学的书没事翻翻也会有新的感触
CSS其实跟JS有相似之处的?Why?其实都是选择dom节点进行操作比如给下面的p标签中的内容加个颜色
要选择p元素(节点 、’标签)不同时期有不用的叫法 然后给它加上属性 在定义属性值: p{color:red}
p是节点 color是p的属性,red是属性的值。
如果在JS中其实也是一样的var x=document.getElementById("img1"); 选择节点
x.src="img/example.png" x代表了被选择的节点. x的src属性的值 改为"img/example.png"
1 <body> 2 <setion> 3 <p>哈哈哈哈哈哈哈</p> 4 <img src="" alt="什么都没有" id="img1"/> 5 <input type="button" id="btn1" value=“按钮” />
6 </section> 7 </body>
下面总结一下不常用的选择器
1子选择符 标签1>标签2
<section> <h2> an h2 heading</h2> <p>this is paragraph</p> <p>paragraph 2 has <a href="#"> a link </a> in it .</p> <a href="#">link</a> </section> section>h2{font-style:italic;}//标签1必须是第二个元素的父元素,标签1不能是标签2父元素以外的祖先元素 同时也可以这样使用 !DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>子选择符</title> <style> div>h2{color:red} .content>.menu{color:yellow} </style> </head> <body> <div class="content"> <h2>Hellow World</h2> <p class="menu">子选择符的特性</p> </div> </body> </html>
2.紧邻同胞选择符 标签1+标签2 标签2必须紧跟在同胞标签1的后面
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>紧邻同胞选择符</title> <style> h1+h5{color:red;border:1px solid greenyellow} h5+.p1{color:pink} .p1+.p2{font-size:250%} </style> </head> <body> <div> <h1>国务院白皮书</h1> <h5>XXX发表讲话就三大代表</h5> <p class="p1">大笑江湖万万没想到完美世界幻想时空</p> <p class="p2">英雄联盟瑟瑟琴女皮城女警一狙爆头</p> </div> </body> </html>
3 一般同胞选择符~ 标签1 ~标签2 标签2不一定紧跟在同胞元素标签1的后面
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>一般同袍选择符</title> <style> h2~ul{border:1px solid red} </style> </head> <body> <div > <h2>嘿嘿</h2> <p>1123115</p> <ul> <li>nihao</li> <li>heihei</li> </ul> </div> </body> </html>
标签:
原文地址:http://www.cnblogs.com/Tjinhui/p/5726970.html