1_html基本结构以及样式表

最新推荐文章于 2022-08-11 09:21:35 发布

weixin_30394669

最新推荐文章于 2022-08-11 09:21:35 发布

阅读量145

点赞数

原文链接：http://www.cnblogs.com/chosen-man/p/6682380.html

版权

首先，html的基本结构：

　　　　　　　　<html> 让系统编译时知道是HTML的语言，
　　　　　　　　　　<head>
　　　　　　　　　　　　<title>网页的标题</title>
　　　　　　　　　　</head>
　　　　　　　　　　<body>
　　　　　　　　　　　　主体：可以显示网页内容的
　　　　　　　　　　</body>
　　　　　　　　</html> HTML语言结束

其次，给html添加样式可分为四种：

　　　　第一种：

　　　　　　　　行间样式表

<div id="round" style="width:400px; height:300px;">
    <p>我是测试文字</p>
</div>

　　　　　　优点：

　　　　　　　　　　优先级最高、不会和其他样式冲突
　　　　　　缺点：

　　　　　　　　　　不利于维护、完全没有通用性、代码可读性差

　第二种：

　　　　　　　　内部样式表（写在头部<style>标签里）

<style>
    #b1 {
        width: 200px;
        height: 200px;
        border: 2px solid red;
}
</style>

　　　　　　优点：
　　　　　　　　　　1.单个页面中，不会有多余代码
　　　　　　　　　　2.减少外部请求
　　　　　　　　　　3.在单个页面中可以做到通用
　　　　　　缺点：
　　　　　　　　　　1.没有办法在整个项目中复用
　　　　　　　　　　2.后期整个项目风格变换，修改起来不便

　　第三种：

　　　　　　　　外部样式表（使用link ，将外部单独的CSS文件引入html）

<link rel="stylesheet" href="css/index.css" />

　　　　优点：
　　　　　　　　　　1.便于整个项目的修改和维护
　　　　　　　　　　2.多个页面之间可以进行复用
　　　　缺点：
　　　　　　　　　　1.规划不好，容易代码冲突
　　　　　　　　　　2.在单个页面中会有多余代码
　　　　　　　　　　3.会增加外部请求

　　第四种：

　　　　　　　Import （在样式表中，引入新的样式表）：
　　　　　　　　

　　　　　　　　不建议使用，性能较差，不能并发加载

转载于:https://www.cnblogs.com/chosen-man/p/6682380.html

weixin_30394669

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
1_html基本结构以及样式表

首先，html的基本结构：　　　　　　　　<html> 让系统编译时知道是HTML的语言，　　　　　　　　　　<head>　　　　　　　　　　　　<title>网页的标题</title>　　　　　　　　　　</head>　　　　　　　　　　<body>　　　　　　　　　　　　主体：可以显示网页内容的　　　　　　　　　　&l...
复制链接

扫一扫