CSS 的对象映射

CSS 的对象映射有好几个方法:

1. 标签名映射:(例: 全部<p/>标签)
P { ...css code... }

2. id 映射:( 例 <p id="myid" >...</p>)
#myid{ ...css code...}
语法:井号("#")

3. 类 映射:(例:全部包含 clas = "myclass"的元素)
.myclass {...css code...}
语法:点(".")

4.节点路径映射(更具体化要加样式的对象)
例1: body 标签中的 P标签
body p {...code...}
例2: <p/>标签中 <a/>标签, 并且类为"aclass" 的标签
p a .aclass{...code...}
语法:空格(" ")
层次越多...对象越具体(2层够用了...)

5.复合映射(多种元素用同一个样式)
例: <p/> <td/> <li/> 用同一个样式
p,td,li {...code...}
语法:逗号(",")

6.附: 选择全部
例: 选择 <body/> 下所有元素
body * {...code...}
语法:星号("*")

以上语法可以混合使用的....

希望你再学下优先权的问题,有冲突或重复的样式,会优先最具体的,同段代码, 通常最后的有效(像!important等语法,你以后会学到)
例:
p {color:red;}
p .myclass {color:blue}
所有p的颜色为红, 但class="myclass" 的p,被更具体化为蓝色

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值