当前位置:Gxlcms > 前端框架 > css在html中三种实现方式是什么

css在html中三种实现方式是什么

时间:2021-07-01 10:21:17 帮助过:44人阅读

三种实现方式:1、在html标签内使用style属性定义css样式;2、在html文件头部“<style></style>”标签内写入css样式;3、通过“<link>”标签引入外部CSS样式文件。

本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。

css的样式引用由3种方式。分别为内联定义、链入内部CSS和链入外部CSS。

1、内联定义

内联定义,即在对象的标记内使用对象的style属性定义适用的样式表属性,格式定义为 :<p style="内容"></p>,如下示例


浏览器此时显示内容


2、链入内部CSS

CSS内链接是由<style></style>标记对放在<head></head>中,在<style>中有一个类型属性type,后面接test/css,表示CSS文本,语法格式如下:

<style type="text/css">
   /*这里写CSS内容*/
 </style>

示例如下:

效果图如下:


3、链接外部CSS

css外链接是把CSS文件放在网页外面,通过链接<link>使CSS文件对本网页的样式有效,就相当于C语言的.h文件喽。

<link>里面的属性有type、rel、href,其中type固定为text/css,rel(即样式表)固定为stylesheet,href自然指的就是css文件的地址了,语法格式为:

 <link type="text/css" rel="stylesheet"  href="css文件的存放地址">

示例代码如下:

web.css内容为

效果如下


学习视频分享:css视频教程

以上就是css在html中三种实现方式是什么的详细内容,更多请关注gxlcms其它相关文章!

人气教程排行