扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
1、内联式:
创新互联从2013年开始,先为金安等服务建站,金安等地企业,进行企业商务咨询服务。为金安企业网站制作PC+手机+微官网三网同步一站式服务解决您的所有建站问题。
div style="css样式写在这".../div
2、外联式:
style
选择器 {css样式写在这}
/style
3、外链式:
link rel="stylesheet" href="css文件url写在这" /
内部样式是包含在网页文件中的样式
例如:
style
body {
color:red;
}
/style
外部样式是在页面中引用一个.CSS文件,比如网站中为了界面统一,通常会下一个通用的.css文件,基本的样式都包含在其中,到时用的时候每个页面只用写上link href=" " rel="stylesheet" type="text/css"就可以了。在需要样式比较多的时候最好用外部样式表,好管理,代码也少写很多,不然你的每一个页面都得写这些东西,会很乱。行间样式其实跟内部样式表使用范围更低一级,内部样式表是整个页面都可以调用,行间样式写在哪个标签上,只能他使用,比如table style="border:5px solid gray;"/table
样式的引用形式大致可分为以下四种:
一、行间样式,即直接加在标签上的样式 例:div style="width:50px;"/div
二、内联样式 即用style /style标签括起来写在页面中的样式
三、外联样式:即将样式单独放到一个文件夹中,然后用link标签引入页面的形式
四,导入样式,即将样式,按模块划分或其它的分法分别放在不同的css文件中,然后用@导入到其它样式中 。此方法建议不要用,因为效率不是特别高
前三种的优先级为: 行间 内联 外联
行间样式,p style="color:red;"adfdfa/p,如果是改一个两个P标签还算好,复制一下,如果是几十个P标签呢,要换颜色,那得复制几十次,这代码是不是就多了起来了,性能肯定会有所下降吧,并且复制这么多次也是很麻烦的不是吗?
CSS样式的引用方式有三种:
一、行间样式表
行间样式表是指将CSS样式编码写在HTML标签中,格式如下
h1 style="font-size:12px;color:#000FFF"
我的CSS样式。
/h1
行间样式表由HTML元素的HTML元素的style支持,只需将CSS代码用分号隔开写在style=""之中。这是最基本的形式,但是它没有实现表现与内容分离且不能灵活的控制多个页面所以我们只是在调试CSS代码的时候使用。
二、内部样式表
内部样式表与行间样式表相似都是把CSS代码写在HTML页面中,稍微不同的是前者可以将样式表放在一个固定的位置,格式如下
html
head
title内部样式表/title
style type="text/css"
h1{font-size:12px;
color:#000FFF
}
/style
/head
body
h1我的CSS样式。/h1
/body
/html
内部样式表编码是初级的应用形式,不能达到跨页面使用所以不适合使用。
三、外部样式表
外部样式表是CSS应用中最好的一种形式,它将CSS样式代码单独放在一个外部文件中,再由网页进行调用。多个网页可以调用一个样式文件表,这样能够实现代码的最大限度的重用及网站文件的最优化配置,格式如下
html
head
title外部样式表/title
link rel="stylesheet" rev="stylesheet" href="style.css"
/head
body
h1我的CSS样式。/h1
/body
/html
在style.css中的代码为
h1{font-size:12px;
color:#000FFF
}
我们在head中使用了link标签来调用外部样式表文件。将link指定为stylesheet方式,并使用了href="style.css"指明样式表文件的路径便可将该页面应用到在style.css中定义的样式。
外部样式表: 当样式需要应用于很多页面时,外部样式表将是理想的选择。在使用外部样式表的情况下,你可以通过改变一个文件来改变整个站点的外观。每个页面使用 link 标签链接到样式表。link 标签在(文档的)头部:head link rel="stylesheet" type="text/css" href="mystyle.css" / /head浏览器会从文件 mystyle.css 中读到样式声明,并根据它来格式文档。
内部样式表: 当单个文档需要特殊的样式时,就应该使用内部样式表。你可以使用 style 标签在文档头部定义内部样式表,就像这样:head style type="text/css" hr {color: sienna;} p {margin-left: 20px;}
内联样式: 由于要将表现和内容混杂在一起,内联样式会损失掉样式表的许多优势。请慎用这种方法,例如当样式仅需要在一个元素上应用一次时。要使用内联样式,你需要在相关的标签内使用样式(style)属性。
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流