今天小编跟大家讲解下有关CSS上下文选择符实现基于位置为HTML元素添加样式 ,相信小伙伴们对这个话题应该有所关注吧,小编也收集到了有关CSS上下文选择符实现基于位置为HTML元素添加样式 的相关资料,希望小伙伴们看了有所帮助。
CSS的选择符有三种。①上下文选择符;②ID和Class选择符;③属性选择符 而上下文选择符的最大好处就是可以方便的实现基于位置为HTML元素添加样式比如我们想位于article和aside标签中的p标签 设置不同的样式 上下文选择符也叫后代组合式选择符 是以空格分隔标签名的 其格式为: 标签1 标签2 {声明} 这里的标签就是HTML元素 标签2是我们想要选择的目标 而且只有在标签1是标签2的祖先元素时才能选中标签2.只要是祖先元素即可 不一定非要是父元素 我们以下列HTML代码为例 进行演示: 复制代码代码如下: <!DOCTYPE html> 2: <html> <head> <title>HTML 5 Template</title> <meta charset="utf-8"> <link href="https://www.aidi.net.cn//css/style.css"rel="stylesheet"type="text/css"> </head> <body> <article> <h1>上下文选择符</h1> <p>这是位于article元素中的p元素</p> </article> <aside> <p>这是位于aside中的p元素</p> </aside> </body> </html> 在没有应该CSS样式的情况 查看运行效果
来源:爱蒂网