web知识点

html中的注释:
1.注释的格式<!--要注释的功能-->
2.注释的两个主要功能:1.注释不要的代码 2.调试程序,查询代码哪里出现了错误
3.主要的快捷键:Ctrl+s
CSS的选择器类型:
1.id选择器:<!--一个元素只能有一个id值 ,id是一一对应的关系。-->
<div id="only" >123</div>
创建一个CSS的文件:
#only{
	background-color: yellow;
	font-size: 50px;
	width: 100px;
	height: 100px;
	border-radius: 20%;
}
<!--id值的前面一定要有#号-->
2.class选择器:<!-- class和元素的关系是多对多的关系,一个class可以有多个元素,一个元素可以有多个class。 -->
<div class="only">708</div>
创建一个CSS的文件:
.only{
	background-color: blue;
	font-size: 80px;
	width: 200px;
	height: 200px;
	<!--使用class选择器的时候要注意class值的元素前面要加.,例如.only-->
3.标签选择器:标签是可以当作选择器是使用
example:
<div>123</div>
应用CSS文件:
div{
   background-color: blue;
	font-size: 80px;
	width: 200px;
	height: 200px;
}
4.通配符选择器 (*)但凡是标签,都能被选择器选择-
5.行间样式
example:我们在标签里面定义元素的样式
<div style="background-color: yellow; font-size:20px;color: green;">123555666</div>
<!--行间样式是在标签里面定义的-->
6.伪类选择器:本人觉得伪类选择器是在CSS中比较常用的一种选择器之一,也是比较复杂的一种选择器,hover是伪类选择器的重要元素。
example:
定义一个链接:<a href="http://www.baidu.com">www.baidu.com</a>
<a href="http://www.taobao.com">www.taobao.com</a>
<a href="http://www.jingdong.com">www.jingdong.com</a>
应用CSS文件:a:hover{
	text-decoration: underline;
	background-color: #f40;
	color: #fff;
	font-size: 16px;
	font-weight: bold;
	font-family: arial;
	border-radius: 10px;
	![这里写图片描述](https://img-blog.csdn.net/2018091420063743?watermark/2/text/aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hoamlhbjUyNA==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70)
7.属性选择器
8.伪元素选择器

猜你喜欢

转载自blog.csdn.net/Hhjian524/article/details/82708159