• 技术文章 >web前端 >前端问答

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

    醉折花枝作酒筹醉折花枝作酒筹2021-04-07 11:26:39原创2615

    三种实现方式: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中三种实现方式是什么的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:HTML CSS
    上一篇:css哪个样式不推荐使用 下一篇:JavaScript双斜杆代表啥
    千万级数据并发解决方案

    相关文章推荐

    • 用css3实现一个奥运五环• css怎么设置扇形区域• 使用css3中的什么规则来定义动画• css样式表常驻留在文档的什么区域中• css哪个样式不推荐使用
    1/1

    PHP中文网