html引用css的一个实例

最新推荐文章于 2022-06-07 13:36:57 发布

不豫

最新推荐文章于 2022-06-07 13:36:57 发布

阅读量544

点赞数 2

分类专栏：前端

本文链接：https://blog.csdn.net/qq_44912697/article/details/100674436

版权

前端专栏收录该内容

11 篇文章 0 订阅

订阅专栏

如何引用css
1.外联式（解耦性大）
2.内嵌式

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<!-- 外联式 -->
	<link rel="stylesheet" type="text/css" href="./css的页面引用.css">
	<!-- 内嵌式 -->
	<style type="text/css">
		h1{
			font-size: 45px;
			color: gold;
		}
	

	</style>
</head>
<body>
	<h2 class="green big">武士大哥</h1>
	<h1 id="h101">我说的</h1>
	<div align="center">hhhhhhh</div>
	<!-- 行内样式 -->
	<a href="baidu.com" style="font-size:50px color:pink" >百度</a>
	<div class="box">dhasjikAhdjskGhjfhdjagyueJ<span>DKgaydhjkalHUAISHKhsdIGDHSXGushjsaHJKSDSH</span>
	案审判回<span class="span01">复i饿啊u啊液体</span>饿我去饿金佛啊啊回复第十九<span class="span02">卡拉恢复健康的喇叭</span>裤法律的安居客六发动机撒开放接口和卡罗拉还会对怕互派大使肌肤的卡片哈迪斯否额外衣服好看安徽快递师傅i哦委屈恶虎Akd
	</div>

	<a href="baidu.com" class="link"> baidu </a>
</body>
</html>

div{
	font-size: 33px;
	color: green;

}
/*css常用样式*/
h2{
	font-size: 25px;
	color: pink;
	font-family: '微软雅黑';
	/*用中文可能会导致乱码，可以改用Microsoft Yahei*/
	font-style: italic;
	/*文字倾斜  normal为正常 */
	font-weight: bold;
	/* 文字加粗 normal为正常 */
	line-height: 40px;
	/* 行高 包括字体大小 */

	/* 也可以font:normal 20px/40px 'Microsoft Yahei'; */
	/*font：是否加粗 字号/行高 字体*/

	text-decoration: underline;
	text-indent: 40px;
	/* 首行缩进*/
	text-align: center;
}

*{
	font-size: 50px
}
/*对所有的标签进行操作*/
#h101{
	color: blue;
}
/*id选择器 注意覆盖情况*/

.green{
	color: green;
}
.big{
	font-size: 50px;
}
/*类选择器  id选择器优先于类选择器*/

.box{
	font-size: 20px;
	line-height: 40px;
	text-indent: 40px;
}
.box span{
	color: red;
	font-size: 30px;
}

.box .span01{
	color: blue;
	/*font-size: 40px;*/
}
.box .span01,.span02{
	font-size: 40px;
}
/*多项相同的属性放在一起*/
/*层级选择器*/

/*伪类选择器*/
.link{	
	font-size: 40px;
	color: green;
}
.link:hover{
	color: gold;
	font-weight: bold;
	
}

/*伪元素 具有无法选中的特性 一般用于解决bug*/
.box:before{
	content: "wahahaha";
	color: black;
}
.box:after{
	content: 'haishuaihd';
	color: black;
}

不豫

关注

2
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
html引用css的一个实例

如何引用css1.外联式（解耦性大）2.内嵌式<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title>  <link rel="stylesheet" ty...
复制链接

扫一扫