2 CSS基本选择器
2 基本选择器
id选择器
id选择器使用“#”进行标识，后面紧跟id名，其基本语法格式为：
#id名{属性1:属性值1;属性2:属性值2;属性3:属性值3;}
该语法中，id名即为HTML元素的id属性值。大多数HTML元素都可以定义id属性，元素的id值是唯一的，只能对应于HTML中某一个具体的元素。
id选择器不支持像类选择器那样定义多个值，类似"id="bold font24""的写法是错误的。
class选择器
class选择器使用“.”进行标识，后面紧跟class名，其基本语法格式为：
.class名{属性1:属性值1;属性2:属性值2;属性3:属性值3;}
标签名选择器
通过元素的属性名或属性值来匹配元素。例如，[type="text"]选择器匹配所有type属性为"text"的元素。
input[type="text"]{
boeder: 1px solid blue;
}
通配选择器
语法：*{属性1:属性值1;属性2:属性值2;属性3:属性值3;}
说明：通配符的写法是“*”，其含义就是所有元素。
*{margin:0;padding:0;}代表清楚所有元素的默认边距值和填充值。
作用是：有些标签他默认是带有边距和间隔的，这个通配选择器就是选择所有的标签删除所有的边距的。
/*
#id # id选择符
element # 元素选择符
.class # claw43ss选择符
selector1, selector2, selectorN # 同时获取多个元素的选择符
$("#id")
$(".class")
$("element")
$(".class,p,div")
*/
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
#i1{
color: red;
}
.c1{
color: red;
}
.c2{
font-size: 32px;
}
</style>
</head>
<body>
<div id="i1">item1</div>
<div id="i2">item2</div>
<div id="i3">item3</div>
<div class="c1 c2">item4</div>
<div class="c1">item5</div>
<div class="c1">item6</div>
</body>
</html>
2 CSS基本选择器的更多相关文章
- CSS的选择器
<div id="demo"> <div class="inner"> <p><a href="#" ...
- JS实战 · 仿css样式选择器
代码如下: <html> <head> <meta http-equiv="Content-Type" content="text/ ...
- CSS 后代选择器
后代选择器(descendant selector)又称为包含选择器. 后代选择器可以选择作为某元素后代的元素. 根据上下文选择元素 我们可以定义后代选择器来创建一些规则,使这些规则在某些文档结构中起 ...
- css后代选择器（div.class中间不带空格）
如果我要查找<div>上用了.class的元素,查找方法:div.class:中间是不空格的. 以上这种形式为css后代选择器 参考:http://www.w3school.com.cn/ ...
- CSS样式选择器优先级
CSS样式选择器分为4个等级,a.b.c.d,可以以这四种等级为依据确定CSS选择器的优先级. 1.如果样式是行内样式(通过Style=””定义),那么a=12.b为ID选择器的总数3.c为Class ...
- css中选择器的使用
css是英文Cascading Style Sheets的缩写.它是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言.我们再将html比喻 ...
- CSS 派生选择器
派生选择器 通过依据元素在其位置的上下文关系来定义样式,你可以使标记更加简洁. 在 CSS1 中,通过这种方式来应用规则的选择器被称为上下文选择器 (contextual selectors),这是由 ...
- CSS 类选择器
在 CSS 中,类选择器以一个点号显示: .center {text-align: center} 在上面的例子中,所有拥有 center 类的 HTML 元素均为居中. 在下面的 HTML 代码中, ...
- CSS id 选择器
id 选择器 id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式. id 选择器以 "#" 来定义. 下面的两个 id 选择器,第一个可以定义元素的颜色为红色,第二 ...
- CSS类选择器和ID选择器
CSS类选择器和ID选择器皆允许以一种独立于文档元素的方式来指定样式,同时二者皆区分大小写. 区别如下: 第一:在同一个页面内,不允许有相同名字的id对象出现,但是允许相同名字的class 第二:当页 ...
随机推荐
- win32 - wsprintf和wvsprintf
前者很常用, 经常被用来转换为字符串或者拼接字符串. 例子: #include <Windows.h> #include <stdio.h> int main() { int ...
- 了解企业架构EA(Enterprise Architecture)
一.企业架构简介 企业架构:Enterprise Architecture,EA,或企业体系结构,是在信息系统架构设计与实践基础上发展起来的一个特殊领域. 但是企业架构现在还没有一个公认的定义,综合现 ...
- 服务端高性能网络IO编程模型简析
服务端高性能网络IO编程模型简析 一.客户端与服务器端 多数网络应用可以分为客户端(client)和服务器端(server)模型,然后中间通过各种定义的协议来进行两端的通信. 比如常用的 Nginx ...
- 遭遇DDOS攻击忍气吞声？立刻报警！首都网警重拳出击，犯罪分子无所遁形
公元2024年2月24日18时许,笔者的个人网站突然遭遇不明身份者的DDOS攻击,且攻击流量已超过阿里云DDos基础防护的黑洞阈值,服务器的所有公网访问已被屏蔽,由于之前早已通过Nginx屏蔽了所有国 ...
- 【八股cover#2】CPP语法 Q&A与知识点
CPP语法 Q&A与知识点 简历cover 1.熟练使用C的指针应用及内存管理 指针与引用的区别 指针是一个存储地址的变量,可以有多级,可以为空,并且在初始化后可以改变指向: 引用是原变量的别 ...
- 【LeetCode字符串#extra】KMP巩固练习：旋转字符串、字符串轮转
旋转字符串 https://leetcode.cn/problems/rotate-string/ 给定两个字符串, s 和 goal.如果在若干次旋转操作之后,s 能变成 goal ,那么返回 tr ...
- tomcat启动错误“The temporary upload location”
目录 问题的原因 解决方案 临时的,直接重新启动项目就行,会重新建立临时文件夹 在配置文件中配置tomcat的临时目录: 写个配置类,通过@Bean的方式配置目录: 问题的原因 在Linux 系统中, ...
- 【Azure 事件中心】Event Hub服务中的度量值指标介绍
问题描述 Event Hub服务中的度量值指标解说 1)request和message的区别 2)capture backlog 和 capture message 怎么理解 3)quota exce ...
- 一文了解 Nebula Graph DBaaS 服务——Nebula Graph Cloud Service
Nebula Graph DBaaS 作为一款 DBaaS(DataBase as s Service)的产品,Nebula Graph Cloud Service 极大地降低了研发人员使用 Nebu ...
- Toyota Programming Contest 2024#2（AtCoder Beginner Contest 341）D - Only one of two（数论、二分）
目录 链接 题面 题意 题解 代码 总结 链接 D - Only one of two 题面 题意 求第\(k\)个只能被\(N\)或\(M\)整除的数 题解 \([1,x]\)中的能被\(n\)整除 ...