HTML.day_03

最新推荐文章于 2021-12-01 17:53:25 发布

```???

最新推荐文章于 2021-12-01 17:53:25 发布

阅读量80

点赞数 1

分类专栏： HTML5 文章标签： HTML_css

本文链接：https://blog.csdn.net/zd_88888/article/details/103315221

版权

HTML5 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

CSS 是修饰html的计算机语言，‘层叠样式表’**

1.css基本写法

（1）.	
	<head>
		<style>
			#{
				color:#;
			}
		</style>
	</head>
				
（2）.
	<body>
		<# style="color:#;"><#>
	</body>
（3）.<link rel="stylesheet" herf="css文件路径位置"> ---->引入外部的css文件
（4）.@import url(‘文件路径’)；--->引入外部的css文件
		color:在css中也可以使用英文单词也可以使用进制和rgb

2。不同CSS使用方式的优缺点

1.<p style="color"red";>123456</p>
		缺点：
			1.结构和样式没有分离
			2.css样式不能重复使用，只能在当前标签使用一次
		优点：
			1.写法简单，适用范围广
			2.优先级高
2.<style>
		div{
			color:red;
		}
	</style>
		缺点：
			1.结构和样式没有分离
			2.样式无法在多个HTML文件中重复使用
		优点：
			1.相对于上面的style属性，这种写法可在当前网页中实现CSS央视重复使用
3.<link rel="stylesheet" href="CSS路径">
		缺点：
			1.需要频繁切换代码窗口
		优点：
			1.html结构与样式实现了完整分离
			2.代码能重复使用

2.CSS使用方法

	style属性优先级最高
	link和style标签优先级相同，style相同的话，后面的标签会覆盖前面的属性，
	属性不同的话会一起使用

CSS选择器

	1.hatml标签选择器
		选中div中的标签，
			div{
				属性
			}
	2.class选择器（类选择器）
		.p{
			属性
		}
		class选择器标签属性前需要加.
		全局属性：name  title  id(html当中id需要唯一)  class
		id需要唯一，class可以重复
	3.ID选择器
		#p{
			属性
		}
		ID选择器 属性前需要加#
		选择器优先级：ID>CLASS>HTML标签

1.*表示通配符表示一次选中全部标签

2.后代选择器div p   选择div中的所有p标签

3.子元素选择器div>p 选择div的直系p

4.交集选择器 span.d1  标签名叫span并且class叫d1

5.并集选择器 div,p,h1,h2 同时选中当前的标签

6.序列选择器 ul li:first child选中标签：子元素 必须排在位置最前面
last child选中标签：子元素 最后一个元素
7.
选择器
	相邻兄弟选择器
		a+b{
			属性
		} 
		必须在相邻位置
	普通兄弟选择器
		a~b{
			属性
		}