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>

 

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

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

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • jmeter并发测试步骤_jmeter怎么确定最大并发数

    jmeter并发测试步骤_jmeter怎么确定最大并发数第一种方案直接从数据库中获取账号和密码1、设置线程数为20,我们的并发用户量就是20个用户同时登录2、添加定时器3、设置集合点,当用户数量达到20个的时候再同时请求进行登录操作4、添加配置元件:JDBCConnectionConfiguration5、添加JDBCrequest请求(从数据库获取登录账号和密码)7、添加http登录请求8、查看结果第二种方案对登录账号和密码进行参数化1、添加设置线程数2、添加定时器

    2022年9月30日
    2
  • 艺术概论[通俗易懂]

    目录一.艺术的本质与特征艺术本质1.客观精神说2.主观精神说3.模仿说/再现说艺术的特征二.艺术的起源中外艺术史上关于艺术起源的五种观点艺术起源的第六种看法:多元决定论三.艺术的功能与艺术教育艺术的社会功能艺术教育四.文化系统中的艺术作为文化现象的艺术艺术与哲学艺术与宗教艺术与道德艺术与科学五.实用艺术实用艺术的主要种类实用艺术的审美特征中外实用艺术精品赏析六.造型艺术造型艺术的主要种类造型艺术的审美特征中外造型艺术精品赏析七.表情艺术表情艺术的主要种类表情艺术的审美特征中外表情艺术的精品赏析八.综合

    2022年4月17日
    49
  • pycharm如何分段运行_pycharm只运行部分代码

    pycharm如何分段运行_pycharm只运行部分代码在最新版的pycharm中拥有类似jupyter的分段执行代码功能,其使用方法如下:1.在想要分段运行的段前一行(空白行)输入#%%2.选择Usescientificmode3.分段运行的结果补充知识:Pycharm分行或分块执行介绍Pycharm中其实也可以使用类似于Spyder和Jupyter中的分行或分块执行,主要可以使用两种方法。需要注意的是,下面两种方法的本质都是在控制台执行,要注意…

    2022年8月26日
    53
  • react中父组件向子组件传值

    react中父组件向子组件传值1.子组件代码:定义props.属性名来接收父组件传递过来的值importReact,{Component}from”react”;exportdefaultclassSonextendsComponent{render(){return<div>我是子组件—{this.props.text}</div>;}}2.父组件代码:在引用子组件时,在子组件身上传递数据(用子组件定义的属性来传递)importR

    2022年5月27日
    34
  • java和html_如何区别html和html5

    java和html_如何区别html和html5JSP和HTMLJSP代表JavaServerPages;它主要用于开发动态网页,文件的扩展名为.jsp。JSP的主要优点是程序员可以在HTML中插入Java代码;使用JSP标签插入Java代码。程序员可以编写<%标签来启动Java代码,并在Java代码的末尾写入%>标签。JSP允许在HTML文件中插入Java代码HTML代表超文本标记语言。它是众所周知的用于开发网页的标记语言,有助于构建网页结构。JSP和HTML之间的区别1、采用的技术不同HTML是客户端技术,提供

    2025年8月13日
    2
  • 两位数乘法的速算方法(三)

    两位数乘法的速算方法(三)两位数乘法的速算方法(三)一、速算方法总结序号类别子类别例如应用举例1首位相同尾数互补71X79|(7+1)x7||1×9|=56092尾数不互补72X73(72+3)x70+2×3=52563尾数和为983X867218-8X10=71384尾数和为1185X867230+8X10=73105尾数相同首数互补27X87|(2×8+7)||7×7|=23496首数不互补27X37|(2X3+7)|

    2022年6月7日
    37

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

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