CSS属性选择器_伪类选择器的属性使用

CSS属性选择器_伪类选择器的属性使用css04.css1/*属性选择器相关样式*/234[love]{5color:green;6}78[love="me"]{9color:re

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

css04.css
 1 /*属性选择器相关样式*/
 2 
 3 
 4 [love] {
 5     color: green;
 6 }
 7 
 8 [love="me"] {
 9     color: red;
10 }

  

 1 <!DOCTYPE html>
 2 <html lang="ch-zn">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6     <link rel="stylesheet" href="css04.css">
 7     <style>
 8         div>[class^=first] {
 9             color:yellow;
10         }
11         div>[class$=CD] {
12             color: aqua;
13         }
14 
15         div>[class*=CA] {
16             color: chocolate;
17         }
18 
19         div>[class~=c2] {
20             color: darkmagenta;
21         }
22     </style>
23 </head>
24 <body>
25     <p>我是一个p标签</p>
26     <p love="you" >我也是一个p标签 我有一个自定义属性love 其值为you</p>
27     <p love="and" >我也是一个p标签 我有一个自定义属性love 其值为and</p>
28     <p love="me">我也是一个p标签 我有一个自定义属性love 其值为me</p>
29     <div>
30         <p id="d1" class="first ABC">属性选择器  1 补充示例</p>
31         <p id="d2" class="first ABCE">属性选择器  2 补充示例</p>
32         <p id="d3" class="ADCD">属性选择器  3 补充示例</p>
33         <p id="d4" class="BCAD">属性选择器  4 补充示例</p>
34         <p id="d5" class="tBCADT">属性选择器  5 补充示例</p>
35         <p id="d6" class="c1 c2 c3 c4">属性选择器  6 补充示例</p>
36         <p id="d7" class="c1c2c3">属性选择器  7 补充示例</p>
37     </div>
38 </body>
39 </html>

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/167006.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • 深度学习小白实现残差网络resnet18 ——pytorch「建议收藏」

    深度学习小白实现残差网络resnet18 ——pytorch「建议收藏」深度学习小白实现残差网络resnet18——pytorch利用闲暇时间写了resnet18的实现代码,可能存在错误,看官可以给与指正。pytorch中给与了resnet的实现模型,可以供小白调用,这里不赘述方法。下面所有代码的实现都是使用pytorch框架书写,采用python语言。网络上搜索到的resne18的网络结构图如下。resnet18只看图中左侧网络结构就可以。(ps:使用的是简书上一个博主的图,如有冒犯,请谅解)接下来,根据如图的网络结构进行搭建网络。通过观察网络结构,发现在网络结

  • js数组转对象的方法_js json对象转换成数组

    js数组转对象的方法_js json对象转换成数组记录将数组转成对象方法letarray=[1,2,3,4,5];letobj={};obj=(Object.assign({},array)console.log(obj);//{1,2,3,4,5}

  • linux webstorm激活码2022【中文破解版】

    (linux webstorm激活码2022)本文适用于JetBrains家族所有ide,包括IntelliJidea,phpstorm,webstorm,pycharm,datagrip等。https://javaforall.cn/100143.htmlIntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,上面是详细链接哦~4…

  • emwin仪表控件_仪表开发工程师

    emwin仪表控件_仪表开发工程师本文导读i.MXRT1052具有增强型显示接口(eLCDIF),支持8/16/18/24位的数据总线模式。M1052核心板最高可支持1366×768的高清图像显示,芯片内置音频接口,搭载免费的emWin图形库可广泛应用多媒体设计。一、emWin介绍emWin是Segger公司针对嵌入式平台开发的稳定、高效的图形软件库,适合用于任何图形LCD的操作应用,并可输出高质量的无锯齿的文字和图形,通过调用…

    2022年10月14日
  • Mysql使用到substring截取字符串[通俗易懂]

    Mysql使用到substring截取字符串[通俗易懂]mysql截取字符串的时候是从1开始的而不是从0开始的语法:substring(str,start,len)bz:*_*的形式例子:select* fromcost wheresubstring(bz,1,1)

  • linux clion 激活码【在线注册码/序列号/破解码】

    linux clion 激活码【在线注册码/序列号/破解码】,https://javaforall.cn/100143.html。详细ieda激活码不妨到全栈程序员必看教程网一起来了解一下吧!

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号