HTML_CSS学习:CSSLearning

一、优先级

相关代码:

html 复制代码
<!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>

二、语法规范

相关代码:

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>

三、代码风格

相关代码:

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>
相关推荐
一 乐4 分钟前
高校评教|基于SpringBoot+vue高校学生评教系统 (源码+数据库+文档)
java·数据库·vue.js·spring boot·后端·学习
解局易否结局9 分钟前
SecretFlow 社区MOOC学习笔记
学习
qq_485668991 小时前
前端基础入门学习
前端·学习
子夜江寒1 小时前
HTML 基础知识
前端·学习·html
桌角的眼镜2 小时前
Transformer学习笔记
笔记·学习
思成不止于此2 小时前
MySQL 基础核心知识点全梳理:从入门到实战
数据库·笔记·学习·mysql
崇山峻岭之间2 小时前
C++ Prime Plus 学习笔记028
c++·笔记·学习
我的xiaodoujiao3 小时前
使用 Python 语言 从 0 到 1 搭建完整 Web UI自动化测试学习系列 31--开源电商商城系统项目实战--加入购物车、提交订单测试场景
python·学习·测试工具·pytest
小菜鸟派大星3 小时前
电路学习(九)MOS管
学习·硬件·mos管·电路·电路仿真
点云SLAM3 小时前
Discrepancy 英文单词学习
人工智能·学习·英文单词学习·雅思备考·discrepancy·不一致、不协调·矛盾