浅谈css的四种书写方式(必看篇)

酸甜苦辣是生命的富有,赤橙黄绿是人生的斑斓。低头走路只看到大地的厚重却忽略了高空的高远;抬头走路,只看到高空的广阔,却忽略了脚下的艰辛与险峻。

优先级: 外部样式 < 内部样式表 < 内联样式表;

优先级,即:同名的选择器右边的会覆盖左边

1.内部样式表

CSS Code复制内容到剪贴板
  1. <head>
  2. <style>
  3. /*内部样式表,一般用于覆盖公用样式*/
  4. #headTip{
  5. color:0xff5;
  6. }
  7. </style>
  8. </head>

2.使用link标签,在文档中声明使用外接资源,最常用的一种方式。

css外部样式表指定编码的@CHARSET="utf-8"; 需要放在第一行。

XML/HTML Code复制内容到剪贴板
  1. <head>
  2. <linkrel="nofollow noopener noreferrer" href="./my-common.css"rel="stylesheet"media="screen"type="text/css"/>
  3. </head>
3.@方式,引入css,注意这个是异步加载的,在整个html加载之后才加载,会导致页面闪烁。不推荐使用。
CSS Code复制内容到剪贴板
  1. <head>
  2. <style>
  3. @import'my-common.css';
  4. </style>
  5. </head>
4.内联样式表,优先级最高最直白,但不能复用不容易维护。
XML/HTML Code复制内容到剪贴板
  1. <body>
  2. <inputtype="text"style="color:0x550;font-size:30px;"/>
  3. </body>

以上就是小编为大家带来的浅谈css的四种书写方式(必看篇) 全部内容了,希望大家多多支持~

您可能有感兴趣的文章
css让页脚保持在底部位置的四种方案

CSS如何使用Flex和Grid布局如何实现3D骰子

Flex布局史上最简单使用语法教程

新的CSS 伪类函数 :is() 和 :where()示例详解

纯CSS打字动画的如何实现示例