HTML中引用CSS的方法主要有

  • 行内样式
  • 内嵌式
  • 链接式
  • 导入样式

行内样式

指写在标签里的Style元素的值

 <p style="color: #FF0000;">行内样式</p>

内嵌式

写在HTML页面的head标签里。

   <style type="text/css">
XXXXXXXX
</style>

链接式

也是在head标签内部进行,但是需要在外部专门写CSS文件。

<link rel="stylesheet" href="css/Demo.css" />

导入样式

同样在head标签内。

<style type="text/css">
@import url("css/Demo.css");
</style>

导入和链接的区别为,导入时一次加载,而链接是在需要其样式的时候再去加载,所以链接式的性能更高一点。 尤其是在第一次加载 。

有这么多的方式,那么自然会有优先级了
优先级为

行内样式
链接式
内嵌式
导入式(链接在导入后)
OR
行内样式
内嵌式
导入式

HTML中引用CSS的几种方法的更多相关文章

  1. JSX中引用CSS的一种方法

    第一步:在page或者pages目录下新建一个css文件,例如style.css: 第二步:在jsx页面中import该css文件,例如: import style from './style.css ...

  2. html中插入css的4种方法

    #1:链入外部样式表 <head> <link href="mystyle.css" rel="stylesheet" type=" ...

  3. 在Visual Studio 2015中引用DLL的3种方法

    1.把dll文件复制到可执行文件所在目录 2.将工程属性->配置属性->调试->工作目录更改为dll文件所在目录 3.将工程属性->配置属性->调试->环境设置为P ...

  4. React中引用CSS样式的方法

    相对于html中引用css的三种方法,react中也有三种方法,一一相对: 1. 行内样式:直接在组件内部定义 <div style={{width:'20px',height:'30px'}} ...

  5. HTML5结合CSS的三种方法+结合JS的三种方法

    HTML5+CSS: HTML中应用CSS的三种方法 一.内联 内联样式通过style属性直接套进HTML中去. 示例代码 <pstylepstyle="color:red" ...

  6. CSS中隐藏内容的3种方法及属性值

    CSS中隐藏内容的3种方法及属性值 (2011-02-11 13:33:59)   在制作网页时,隐藏内容也是一种比较常用的手法,它的作用一般有:隐藏文本/图片.隐藏链接.隐藏超出范围的内容.隐藏弹出 ...

  7. CSS中隐藏内容的3种方法

    CSS中隐藏内容的3种方法 一般有:隐藏文本/图片.隐藏链接.隐藏超出范围的内容.隐藏弹出层.隐藏滚动条.清除错位和浮动等. 1.使用display:none来隐藏所有内容 display:none可 ...

  8. 在ASP.NET Core中构建路由的5种方法

    原文链接 :https://stormpath.com/blog/routing-in-asp-net-core 在ASP.NET Core中构建路由的5种方法 原文链接 :https://storm ...

  9. C#调用接口注意要点 socket,模拟服务器、客户端通信 在ASP.NET Core中构建路由的5种方法

    C#调用接口注意要点   在用C#调用接口的时候,遇到需要通过调用登录接口才能调用其他的接口,因为在其他的接口需要在登录的状态下保存Cookie值才能有权限调用, 所以首先需要通过调用登录接口来保存c ...

随机推荐

  1. maven私服的配置使用

    maven的仓库分为本地仓库,远程仓库和私服仓库. 私服仓库一般是公司内部私有的,内部进行维护的.公司员工连接私服,从私服中下载jar,或者将自身的jar传到私服上.私服还可以从中央仓库下载jar,当 ...

  2. Kubernetes的三种探针

    k8s支持存活livenessProbe和就绪readinessProbe两种探针 两种探针都支持以下三种方式 1.exec 通过执行shell命令的方式,判断退出状态码是否是0 示例 exec: c ...

  3. jquery实现get的异步请求

    <%@ page contentType="text/html;charset=UTF-8" language="java" %><html& ...

  4. 在vue项目中的js文件里使用vue实例

    参考的网址:https://blog.csdn.net/weixin_34353714/article/details/86958742 不为其他,就为了记录一下,方便以后查看: 第一种方法: 1.首 ...

  5. SSM框架中mapper和mapping.xml文件在同一个包下需要的配置

    前言 当我们在开发过程中,由于maven项目本身的限制,我们不能直接把我们的mapper.xml文件和对应mapper.java接口文件放到一起,也就是不能直接放在java包中,如图:  因为mave ...

  6. 剑指offer 24:二叉搜索树的后序遍历序列

    题目描述 输入一个整数数组,判断该数组是不是某二叉搜索树的后序遍历的结果.如果是则输出Yes,否则输出No.假设输入的数组的任意两个数字都互不相同. 解题思路 后序遍历,顾名思义根节点位于尾部,故可将 ...

  7. 循环语句for基本概述

    循环语句for基本概述 01. for循环基础语法 for 变量名 in [ 取值列表 ]do 循环体done 02. for循环基本使用示例 #取值列表有多种取值方式,可以直接读取in后面的值,默认 ...

  8. How To Restore Rman Backups On A Different Node When The Directory Structures Are Different (Doc ID 419137.1)

    How To Restore Rman Backups On A Different Node When The Directory Structures Are Different (Doc ID ...

  9. Sublime Text 3如何关闭自动更新

    1.Preferences -> Settings-User 2.插入下面代码:"update_check": false 如果有其他的设置,用逗号隔开,然后保存 3.Pre ...

  10. python通过重启线程,实现服务的热加载

    这个思路后来证明不能用于工作. 因为线程调用没有及时返回,所以不能用这种方式来重启服务. 但作为脑洞,也应该作个记录. import os import shutil import datetime ...