html基础知识测试(测试开发全栈化-HTML)
html基础知识测试(测试开发全栈化-HTML)可以看到所有的字都是蓝色了,那么对应的代码呢?来看看效果:属性1:属性值1;....}
上午我们讲了HTML中CSS样式里的id选择器,接下来说下通配符选择器。
在CSS中,通配符选择器使用 "*" 定义,表示选取页面中所有元素(标签)。
语法:
* {
属性1:属性值1;
....
}
来看看效果:
可以看到所有的字都是蓝色了,那么对应的代码呢?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width initial-scale=1.0">
<title>测试全栈化-HTML中CSS样式之通配符选择器</title>
<style>
* {
color: blue;
}
</style>
</head>
<body>
<div>我的</div>
<span>我是一个人</span>
<ul>
<li>我还是我</li>
</ul>
</body>
</html>
*这里将 html body head等标签都设置为红色
需要注意点:
通配符选择器不需要调用,自动就给所有元素使用样式
在特殊情况下会使用,比如清除所有的元素标签的内外边距,例如:
* {
margin:0;
padding:0;
}
接下来总结下所有的基础选择器:
标签选择器: 可以选出所有的标签,不能差异化选择,在很多场景中使用
类选择器: 可以选出一个或多个标签,可以根据需求选择,使用情况非常多
id选择器: 一次只能选择一个标签,ID属性只能在每个HTML文档中出现一次,一般和js搭配
通配符选择器:选择所有的标签,缺点是选择的太多,有的标签不需要,一般都是特殊情况下使用的。
每个基础选择器都有使用场景,都需要掌握
如果修改样式,类选择器是使用最多的
好的,CSS样式基础选择器就讲完了,大家晚安~