电商网站建设基础教案,微信的微网站模板,国外服务器多少钱一个月,网站运营技巧选择器#xff1a;
选择器是用来选择目标元素的#xff0c;选择器分基础选择器和复合选择器及伪类选择器。
基础选择器#xff1a; 标签名{} /* 1 标签选择器#xff1a;把某类标签全部选中#xff0c;如下#xff1a; */p{font-size:36px;}.类名{} /* 2 类选择器(clas…选择器
选择器是用来选择目标元素的选择器分基础选择器和复合选择器及伪类选择器。
基础选择器 标签名{} /* 1 标签选择器把某类标签全部选中如下 */p{font-size:36px;}.类名{} /* 2 类选择器(class选择器)选中相同类名的元素.声明class调用如下 */.box{width:100px;height:50px;}div classbox/divdiv classbox stylebox/div /* 多类名选择器在class属性中添加多个类名中间用空格隔开即可调用多类名来实现多个样式*/#id名{} /* 3 id选择器选中id被命名为某名的元素#定义id调用id选择器具有唯一性相同的id名只能出现在一个标签上 */#box{width:100px;height:200px;}div idbox/div*{}/* 4 通配符选择器选中文档中所有元素不建议使用一般使用的情况是非常少的。 */*{color:blue;font-size:20px;}复合选择器 div span{/* 1 后代选择器又称包含选择器用于选择标签的后代子孙元素及元素组语法外层标签写在前面内层标签写在后面中间用空格隔开需要强调的是只要是后代无论多少代都可以选中它和子代选择器的区别就在这里不仅仅可以选择紧挨着的下一级元素。 */color:blue;}divullispan苹果/span!-- 被选中项--/li/ul/divspan白菜/spanul lia{/* 2子代选择器选中某标签下紧挨着的某个元素语法父级标签 子级标签强调的是子代选择器选中的是父级紧挨着的子级元素和后代选择器的区别就在这里。 */color:pink;}ullia href#test1/a!-- 被选中项--/lilidiva href#test2/a/div/li/ulp.watermelon{/* 3 交集选择器即又的关系同时满足条件的会被选中语法选择器1选择器2选择器n...,多个选择器连写中间不用任何字符。 */color:red;}papple/pporange/pp classwatermelonwatermelon/p!-- 被选中项--span苹果/spanspan橙子/spanspan classwatermelon西瓜/spanp,span,.pear{/* 4 并集选择器同时选择多个单独或一组标签语法多个选择器中间用逗号连接可以快速选择需要给相同样式的所有标签 */color:red;font-size:40px;}p苹果/pp荔枝/pdel大米/delspan香蕉/spanins地瓜/insdiv classpear梨/div.bananali {/* 5 相邻元素选择器选择紧挨着某元素下的一个兄弟元素语法选择器1 标签注意兄弟元素选择器*/color: red;}ulli苹果/lili classbanana香蕉/lili荔枝/li/ul.banana~li {/* 6 兄弟元素选择器选择挨着某元素下的所有兄弟元素语法选择器1 ~ 标签注意相邻元素选择器*/color: red;}ulli苹果/lili classbanana香蕉/lili荔枝/lili菠萝蜜/lili桃子/li/ul伪类选择器
伪类选择器是以冒号开始的如下面链接伪类选择器需要和伪元素区分 a:link{color:black;}/* 设置未访问的链接样式 */a:visited{color:gray;}/* 设置已访问的链接样式 */a:hover{color:yellow;}/* 设置鼠标经过链接的样式 */a:active{color:red;}/* 设置鼠标点击时链接的样式 *//* 需要注意这四个链接的伪类选择器是按照上面的顺序书写的必须严格遵循。 */提示本文图片等素材来源于网络若有侵权请发邮件至邮箱810665436qq.com联系笔者 删除。 笔者苦海
