html如何连接外部css文件?
html连接外部css文件的方法:
1、html引入css文件之直接在div中使用css样式制作div+css网页
<div style="border:1px red solid;">html引入css文件</div>
说明:html引入css文件的这种方法不建议使用,因为会让页面的标签很多,看起来很累赘,体现不了css的优势,当然如果你非常想用这种方法,在不经常更改的地方可以用一用,但是还是不推荐。
2、html引入css文件之html中使用style自带式
直接在header 里面写css
<style type="text/css"> div{margin: 0;padding: 0;border:1px red solid;} </style>
说明:html引入css文件的这种方法适合在页面较少的情况下使用。优点:速度
快,所有的css控制都是针对本页面标签的,没有多余的css命令;再者不用外链css文件。直接在html文档中读取样式。缺点如果页面较多改版会很麻烦,单个页
面显得臃肿,css不能被其他html引用造成代码量相对较多,维护也麻烦些。但是采用这种方法的公司大多有钱,对他们来说用户量是关键,他们不缺人进
行复杂的维护工作。
3、html引入css文件之使用@import引用外部CSS文件
将一个独立的.css文件引入HTML文件中,导入式使用css规则引入外部css文件,<style>标记也是写在<head>标记中,使用的语法如下:
<style type="text/css"> @import"mystyle.css"; 此处要注意.css文件的路径 </style>
4、html引入css文件之使用link引用外部CSS文件
在网页的<head></head>标签对中使用<link>标记来引入外部样式表文件,使用html规则引入外部css。
<link href="./mystyle.css" rel="stylesheet" type="text/css"/>
说明:html引入css文件的这种方法就不需要style标签,而是直接通过link一个样式来引用外部样式,推荐使用link来引用外部的css样式方法。
以上就是给大家介绍的四种html引入外部css文件的四种方法,更多关于html和css的内容可以关注。
以上就是html如何连接外部css文件?的详细内容,更多请关注其它相关文章!
上一篇: centos上Mariadb主从复制配置
推荐阅读
-
vue.js引入外部CSS样式和外部JS文件的方法
-
Android webview如何加载HTML,CSS等语言的示例
-
vue项目中如何在外部js文件中直接调用vue实例——比如说this-个人文章-SegmentFault思否
-
nodejs遍历文件夹下并操作HTML/CSS/JS/PNG/JPG的方法
-
基于HTML5 Ajax文件上传进度条如何实现(jquery版本)
-
Spring引入外部属性文件配置数据库连接的步骤详解
-
个人博客制作如何选择前端模板 thinkcmf后台加载新模板 CSS js文件
-
详解webpack和webpack-simple中如何引入css文件
-
Flutter中如何加载并预览本地的html文件的方法
-
html5+css如何实现中间大两头小的轮播效果