|
CSS样式 （2） CSS样式选择器 1、每个样式由两部分组成：选择器+声明；声明｛属性名：属性值；、、｝； 2、属性是不分先后顺序；属性及属性间空格、换行是不受影响； 3、每个声明是用分号结束的。 4、Css样式的书写顺序就是浏览器渲染的顺序：显示顺序--自身属性-隐藏属性--其他； 作用：网页信息控制；修饰网页信息的显式样式。 （一）CSS选择器 1、标签选择器 用途：如果设置某个元素的默认样式，可以使用标签选择符来统一文档某个元素的效果，可以使用标签选择器； 2、id选择器 说明： （1）当用id选择器，应该为每一个标签定一个id属性，不如<div id ="id名"></div>； （2）id选择的语法格式是#加上自定义的id名，如#box{}； （3）给id名时要取英文名，不能用关键字（所有的标记属性都是关键字）； （4）一个id只能对应一个标签，最大的用处，创建网页的外围结构。 3、Class标签 注意：使用class应为标签定义一个class名，如：<div class="class名"></div>；类选择器定义一类样式。 4、群组选择器 注意：当有多个选择应用相同的样式时，可以将选择符“,”合并成一组。 5、通配符 注意：通配符选择器表示选择所有元素。一般用来重置默认样式；如*｛margin:0；padding:0；}；权重在0-1间。 6、包含选择器 注意：选择器1与选择器2间用空格隔开，代表选择1包含所有选择器2的元素；如：div ul li{color:red；}. 7、伪类选择器 a:hover,鼠标划过时的状态。 l ink visited(点击过后) hover active（love hate） 附加说明： box-shadow 有六个参数 x-轴偏移量；y-轴偏移量；模糊度（数值+px；数值越高越模糊)，外延（向外发散多少），颜色（阴影的颜色），insert（加上话是向内散发阴影）），如果要增加多个边框阴影，需要细致的微调。如下效果展示： <style> #p1{ font-size:14px; border:1px solid #00BFFF; width: 100px; height:100px; background:cornflowerblue; box-shadow :0 1px 5px 4px #1B6D85,0 0 2px 2px yellow inset, 5px 4px 2px #080808,0 -3px 2px red ; } #p2{ <style> <body> <p id="p1"></p> <p id="p2"></p> </body> 图示效果： P1:cornflowerblue; P2:yellow  亲，分享就到这里吧！！日 
|
|
|
