第五章css选择器初级和背景.pptx

第五章css选择器初级和背景html命名规范 HTML命名规范:名字尽量用英文小写字母可以包含字母,数字,中短线( - ),下划线( _ )有意义的命名(见名知意) 企业命名规范:拓展: 驼峰命名:第一个单词小写,第二单词首字母大写例:imgListcss初级选择器 一、通配符选择器 二、元素选择器 三、id选择器 四、class类选择器 五、ID选择器与Class选择器的区别 六、包含(后代)选择器css初级选择器 三、ID选择器,元素以ID进行命名 div id=info/div #info{width:200px;height:100px; background:red;} 四、类选择器 class选择器，以class=名字 进行命名 例:div class=txt/div .txt{font-size:12px;}css初级选择器 五、ID选择器与Class选择器的区别 区别 1：ID选择器只能在文档中使用一次,. class类选择器可以多次使用。 区别 2： id的权重大于class类的权重 六.后代(包含)选择器 div ul li{list-style:none;}background背景样式background是简写属性，在一个声明中设置所有的背景属性： 1.background-color:规定要使用的背景颜色 2.background-image:把图像设为背景图片 3.background-repeat:规定如何重复背景图片 4.background-position：规定背景图片位置 5.background-attachment:背景关联 6.background:综合样式控制background背景样式1、background-color 背景颜色 十六进制值 #CC0066 #000 英文单词里颜色值 red gray blue yellow Rgba 表达法 (css3)2、background-image 添加背景图片 url(地址) 引用背景图片的地址 none 不使用背景图片background背景样式 3.background-repeat 背景重复 repeat:默认。背景图像在水平和垂直方向均重复 repeat-x:背景图片在水平方向重复 repeat-y:背景图片在垂直方向重复 no-repeat:背景图片只显示一次，不重复background背景样式 4.background-position 规定背景图像位置① 使用关键字：top、bottom、left、right 和 center两两组合而成 ps:如果只出现一个关键字，则认为另一个关键字是 centerbackground背景样式 4.background-position 规定背景图像位置②. 数字表达:一个对应水平方向，另一个对应垂直方向1）百分数值 （水平% 竖直%) background-position：20% 30%；ps:如果只提供一个百分数值，所提供的这个值将用作水平值，垂直值将假设为50% 2）具体的值 （水平px 竖直px) background-position:20px 30px;background背景样式 5、background-attachment背景关联6.background 综合样式控制 background: url() no-repeat 2px 5px; （路径 背景颜色 重复 位置;）