21-属性选择器下










-->

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>21-属性选择器下</title>

    <style>

        /*

        img[alt^=abc]{

            color: red;

        }

        */

        /*

        img[alt|=abc]{

            color: red;

        }

        img[alt$=abc]{

            color: blue;

        }

        */

        /*

        img[alt*=abc]{

            color: red;

        }

        */

        img[alt~=abc]{

            color: red;

        }

    </style>

</head>

<body>

<!--

1.属性的取值是以什么开头的

[attribute|=value] CSS2

[attribute^=value] CSS3

两者之间的区别:

CSS2中的只能找到value开头,并且value是被-和其它内容隔开的

CSS3中的只要是以value开头的都可以找到, 无论有没有被-隔开

2.属性的取值是以什么结尾的

[attribute$=value] CSS3

3.属性的取值是否包含某个特定的值得

[attribute~=value] CSS2

[attribute*=value] CSS3

两者之间的区别:

CSS2中的只能找到独立的单词, 也就是包含value,并且value是被空格隔开的

CSS3中的只要包含value就可以找到

-->

<!--

<img src="" alt="abcdef">

<img src="" alt="abc-www">

<img src="" alt="abc ppp">

<img src="" alt="defabc">

<img src="" alt="ppp abc">

<img src="" alt="www-abc">

<img src="" alt="qq">

<img src="" alt="yy">

-->

<img src="" alt="abcwwwmmm">

<img src="" alt="wwwmmmabc">

<img src="" alt="wwwabcmmm">

<img src="" alt="www-abc-mmm">

<img src="" alt="www abc mmm">

<img src="" alt="qq">

</body>

</html>

H5 21-属性选择器下的更多相关文章

  1. IE7浏览器下CSS属性选择器二三事

    一.为何专门说起IE7 以前,或者说数年前,我们从事桌面端网页开发的时候,基本上都还要兼顾IE6浏览器, 即使有些特性,IE7支持,我们也会忽略之.于是,我们会不自然地把IE6和IE7浏览器归为一路货 ...

  2. H5与CS3权威下.18 and 19 选择器（1）

    18章.CSS3概述 1.从前端技术的角度把互联网的发展分为三个阶段: (1)web1.0:HTML和CSS. (2)web2.0:Ajax,Javascript/DOM/异步数据请求. (3)web ...

  3. H5 19-序选择器下

    19-序选择器下 我是项目 我是项目 我是项目 我是项目 我是项目 我是项目 我是项目 <!DOCTYPE html> <html lang="en"> & ...

  4. 4 CSS导航栏&下拉菜单&属性选择器&属性和值选择器

    CSS导航栏 熟练使用导航栏,对于任何网站都非常重要 使用CSS你可以转换成好看的导航栏而不是枯燥的HTML菜单 垂直导航栏: <!DOCTYPE html> <html> & ...

  5. JQuery中常用的 属性选择器

    jQuery中使用$()作为选择符极大提高工作效率以及方便快捷;一些常用属性的选择器由以下几种 1) $('#id') id选择器 2) $('.class') css选择器,class类名 3) $ ...

  6. CSS 简介、语法、派生选择器、id 选择器、类选择器、属性选择器

    CSS 概述 CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素 样式通常存储在样式表中 把样式添加到 HTML 4.0 中,是为了解决内容与表现 ...

  7. python 全栈开发，Day47(行级块级标签,高级选择器,属性选择器,伪类选择器,伪元素选择器,css的继承性和层叠性,层叠性权重相同处理,盒模型,padding,border,margin)

    一.HTML中的行级标签和块级标签 块级标签 常见的块级标签:div,p,h1-h6,ul,li,dl,dt,dd 1.独占一行,不和其他元素待在同一行2.能设置宽高3.如果不设置宽高,默认为body ...

  8. CSS3 选择器——笔记+实战案例(基本选择器、组合选择器、属性选择器、伪类选择器)

    使用CSS3 选择器——笔记 CSS通过选择器控制HTML元素,CSS选择器对网页对象可以实现一对一.一对多或者多对一的匹配. 一.CSS3选择器分类 CSS选择器在CSS2.1选择器的基础上新增了属 ...

  9. CSS3 选择器——属性选择器

    上一节在<CSS3选择器——基本选择器>中主要介绍了CSS3选择器的第一部分,这节主要和大家一起来学习CSS3选择器的第二部分——属性选择器.属性选择器早在CSS2中就被引入了,其主要作用 ...

随机推荐

  1. UTC时间转换为本地时间

    UTC时间转换为本地时间DATEADD(hour, DATEDIFF(hour,GETUTCDATE(),GETDATE()), OrderDate) <'2015-02-02' DECLARE ...

  2. C#-简介（一）

    1.C#语言简介 C#计算机语言 是一门高级计算机语言 他的开发模式更接近人类和社会的思维模式,有助于提高开发效率 C#历史 1998年COOL这个项目是C#语言的前身,由微软 Anders Hejl ...

  3. Linux进程核心调度器之主调度器schedule--Linux进程的管理与调度(十九）

    主调度器 在内核中的许多地方, 如果要将CPU分配给与当前活动进程不同的另一个进程, 都会直接调用主调度器函数schedule, 从系统调用返回后, 内核也会检查当前进程是否设置了重调度标志TLF_N ...

  4. Android中使用ViewGroup.removeViews()时出现NullPointException解决方案

    在ViewGroup的内部写一个动画效果,在效果结束之后会调用onAnimationEnd(Animation arg0),在此方法中如果直接使用removeViews()时,可能会出现NullPoi ...

  5. 从零开始的cve分析- cve-2016-0095 简易记录

    0x00 前言 看k0shl大佬的SSCTF pwn450 Windows Kernel Exploitation Writeup一文,试着写一个x64下的poc. poc地址:https://git ...

  6. Linux 小知识翻译 - 「SCP和SFTP」

    这次想说说「SCP和SFTP」. 不管SCP还是SFTP,都是SSH的功能之一.都是使用SSH协议来传输文件的. 不用说文件内容,就是登录时的用户信息都是经过SSH加密后才传输的,所以说SCP和SFT ...

  7. Java 7 for Absolute Beginners/Java 7基础教程--代码纠错

    中文版书中的问题代码记录: 只记录了P213后面的错误代码,如果后面发现P213页前面的错误代码,会继续补齐.但我提供的代码都是可以正常运行的,如果有使用者发现中文版书中其他的错误代码请告诉我,方便我 ...

  8. c#窗体获取系统时间、回车触发按钮事件、实现验证码功能

    1.窗体上显示时间: 1)首先新建一个Timer,命名为timer,并在属性中修改Interval为1000: 2)在需要显示时间的地方添加一个label(假设设置名称为:timerLabel): 3 ...

  9. Python中使用class()，面向对象有什么优势　转自知乎

    https://www.zhihu.com/question/19729316 首先我是辣鸡,然后这个问题的确有点意思 首先,类是一个集合,包含了数据,操作描述的一个抽象集合 你可以首先只把类当做一个 ...

  10. 微信硬件平台（七）微信开发--如何存储并定时更新access_token

    https://blog.csdn.net/sct_t/article/details/53002611 我们知道请求access_Token会返回这样一个json,包括access_token(凭证 ...