一、优先级
相关代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>优先级</title>
<!-- <style>-->
<!-- h1{-->
<!-- color: #1f3396;-->
<!-- } -->
<!-- </style>-->
<!-- <link rel="stylesheet" href="./index.css">-->
<style>
h1{
color: #d03458;
/*color: #0c997f;*/
/*color: #0d6efd;*/
/*覆盖着居上，显示蓝色*/
font-size: 100px;
}
h1{
color:blue;
font-size: 40px;
}
/*内部样式优先级高于外部样式*/
</style>
<link rel="stylesheet" href="./index.css">
</head>
<body>
<h1>欢迎来到信阳农林学院</h1>
<!-- <h1 style="color:#55c138;">欢迎来到信阳农林学院</h1>-->
<!-- 行内样式的优先级高于内部样式和外部样式-->
<!-- 优先级规则：行内样式>内部样式>外部样式-->
</body>
</html>二、语法规范
相关代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>语法规范</title>
<style>
h1{
/**/
color:blue;
font-size: 40px;
}
</style>
</head>
<body>
<h1>欢迎来到尚硅谷学习</h1>
</body>
</html>三、代码风格
相关代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>代码风格</title>
<style>
/*展开风格--推荐，便于维护和调试*/
h1{
color: #a41c47;
font-size: 100px;
}
/*h1{color: #0d6efd;font:40px;}*/
/*紧凑风格--项目上线时推荐，可减少文件体积*/
</style>
</head>
<body>
<h1>欢迎来到信阳农林学院学习</h1>
</body>
</html>