美文网首页
12-CSS引入方式

12-CSS引入方式

作者: 小艾同学喔 | 来源:发表于2020-02-28 17:18 被阅读0次

一、 行内样式表(行内式引入)

行内样式表(内联样式表)是在元素标签内部的 style 属性中设定 CSS 样式。适合于修改简单样式.

  <p style="font-weight: 700;">一段话</p>

特点:

1.结构样式不分离,没有体现出结构与样式相分离的思想

2.只能设置单个标签里的样式

3.style中的语法规范和css一样

二、 内部样式表(嵌入式引入)

是将所有的 CSS 代码抽取出来,单独放到一个 <style> 标签中写在header里面。

  <style>
        p {
            font: italic 700 20px Arial;
        }
    </style>

特点:
1.代码结构清晰,但是样式与结构并没有完全分离。
2.通过此种方式,可以方便控制当前整个页面中的元素样式设置。

三、外部样式表

把所有的css代码都写在单独的css文件中,再通过link引入。

一般在html页面的head中,写入link标签引入css文件。

<link rel="stylesheet" href="13-外部样式表.css">

相关文章

  • 12-CSS引入方式

    一、 行内样式表(行内式引入) 行内样式表(内联样式表)是在元素标签内部的 style 属性中设定 CSS 样式。...

  • vue-cli 引入jq,bootstrap,swiper

    引入jqeury方式 引入bootstrap方式 引入swiper方式

  • 引入方式

    css 1 行内式 2 内嵌式 这种方法的使用情况要少的多,最长见的就是访问量大的门户网站。或者访问量较大的...

  • JavaScript

    JavaScript的引入方式 内部引入方式 外部引入方式 JavaScript的组成: ECMAScript:J...

  • JavaScript之引入方式

    JavaScript的引入方式 JavaScript文件的引入方式与CSS引入方式类似,主要也是分为三种:标签内联...

  • vue项目引入 Element ui 的两种方式

    手动引入 按需引入(推荐):自动(vue ui)方式 按需引入生成代码 按需引入:手动方式 1.安装 Elemen...

  • springboot+liquibase多数据源管理配置

    在项目中引入liquibase依赖maven仓库 pom.xml引入方式 gradle引入方式 springbbo...

  • css样式的引入方式

    有3种引入方式a、外部引入b、头部引入c、行内引入(内联引入) -------------------------...

  • CSS 引入方式

    主要内容: CSS 引入方式介绍 ,link 和 @import区别 。 CSS是什么 层叠样式表 (Cascad...

  • CSS引入方式

    1、行内引入 2、内部引入 将CSS定义在head内 3、外部引入 单独编写CSS文件 在HTML->HEAD中引...

网友评论

      本文标题:12-CSS引入方式

      本文链接:https://www.haomeiwen.com/subject/qpulhhtx.html