关于css

常用的选择器:标签选择器,id选择器,class选择器,伪类选择器。

但是还有一个功能强大的选择器:属性选择器,

属性选择器,这样使用,

1、[属性名]{style_value

};

2、[属性名1][属性名2]{

style_value},必须有这两个属性的元素才起作用。

3、[属性名=属性值]{

style_value};针对指定属性的元素设置样式

4、还可以匹配属性

[属性|=属性值]{};[属性^=属性值]{};[属性*=属性值]{};[属性$=属性值]{};

下面举个例子:

<div attr="attr1"></div>
<div attr="attr1"  name="name1"></div>
<div attr="attr1_name"></div>
[attr="name1"]{
background:red;
};

这样中间的那个div背景就会变红;

属性选择器真是强大,开发css框架用得上。

下次写伪类与伪元素的相关知识。

本文分享自微信公众号 - 交互设计前端开发与后端程序设计(interaction_Designer),作者:周立

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2015-11-27

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 超全整理前端开发面试题——CSS篇(2016年)

    介绍一下标准的CSS的盒子模型?低版本IE的盒子模型有什么不同的? (1)有两种,IE 盒子模型、W3C 盒子模型; (2)盒模型:内容(content)、填充...

    前朝楚水
  • 为何webpack风靡全球?三大主流模块打包工具对比

    前端的模块系统经历了长久的演变,对应的模块打包方案也几经变迁。从最初简单的文件合并,到AMD 的模块具名化并合并,再到browserify将CommonJS 模...

    前朝楚水
  • javascript事件详解

    事件流 事件流两种顺序:冒泡与捕获。 简单的添加与删除事件 obj.onclick=function(){} obj.onclick=null; 通用事件添加的...

    前朝楚水
  • 2014年CSS报告

    国外有人把Alex的TOP1000的CSS给爬了一遍,然后做了一些统计,蛮有意思的。

    libo1106
  • JavaScript——对象的属性

    在JavaScript中,所有的对象都是一组属性的集合,属性可以是数值,字符串等原始类型,也可以是函数,或者是其他对象。

    Html5知典
  • JavaScript权威指南 - 对象

    JavaScript对象可以看作是属性的无序集合,每个属性就是一个键值对,可增可删。 JavaScript中的所有事物都是对象:字符串、数字、数组、日期,等等...

    Esofar
  • 基于属性的编辑器框架

    逍遥剑客
  • 深入浅出Object.defineProperty()

    IT故事会
  • Hulu大规模容器调度系统Capos

    Hulu是美国领先的互联网专业视频服务平台,目前在美国拥有超过2000万付费用户。Hulu总部位于美国洛杉矶,北京办公室是仅次于总部的第二大研发中心,也是从Hu...

    李海彬
  • 稳扎稳打JS——“对象”

    一切皆“对象” JS中一切皆“对象” “对象”是属性的集合,而属性又是对象。既然属性又是对象,那么一个对象的属性也可以拥有属性,如: //定义一个函数getN...

    大闲人柴毛毛

扫码关注云+社区

领取腾讯云代金券