属性选择器

CSS3 属性选择器

1. 知识点 ?

属性选择器是根据标签的属性来匹配元素，使用中括号进行标识，语法如下：

语法表	作用
E[attr]	根据是否特定属性来匹配元素
E[attr=“value”]	根据是否设置特定属性值来匹配元素
E[attr^=“value”]	根据属性值是否含特定 vlaue 来匹配元素，属性值为词列表
E[attr$=“value”]	根据属性值是否包含特定 value来匹配元素vlaue必须位于属性的开头
E[attr*=“value”]	根据属性值是否包含特定 value来匹配元素
E[attr 竖号 =“value”]	根据属性值是否包含特定 value来匹配元素属性值是value或以value-开头，如zh-cn

2.提示

E表示匹配元素选择符，可以省略。中括号不可缺；attr 表示 HTML 属性名；value表示 HTML 属性值，或 HTML 属性值包含的子字符串。

3.实例设计

在页面中设计一个简单的导航条结构。为方便演示使用不同形式的属性选择器，特意为每个< a > 标签中定义了不同的属性及其值。

例：

效果如下：

然后用CSS3定义设计一下导航条内部基本样式表，代码如下：

效果如下：

技术有限 有点丑啊 这不是重点！！

本篇文章讲述如何用属性选择设计导航条结构并修饰！ ?

各位客官到这里就结束了！！

猜你想看的：css3选择器"在校生记录博客

出处：在校生有森记录博客
网址：https://mp.csdn.net/mdeditor/102811335
严禁转载！只用于学习交流！