前端三大件之css

已于 2022-03-20 10:45:40 修改
阅读量265 收藏
点赞数 1
文章标签： 前端 css
于 2022-03-19 20:26:24 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_51421373/article/details/123444011
版权

这篇是作者在B站上面按照黑马程序员的视频学习的博客

css

如何在页面里面引入css呢

可以在！加tab生成的标准的html格式中在head中（一般的话是在title后面）进行书写，这个是叫内嵌式

在html同级的文件下，写一个css单独的文件，通过link标签在html里面进行引入，这个要外联式

最不推荐使用的就是行内式就是把css属性写在标签的style属性，这个是有最高级别的，在其他两个引入css的方式中，可以在属性值后面加上 !important也可以设置一个属性值是最高的，当然跟行内式还是比不了的，这个等级谁高后面还会详细的介绍

css中这个语法规则就是
​选择器 {
​ css属性：css属性值；
}

大概就是这样的内容

具体上手写的话就是这个意思

以下的是我们在开发中很常用的几个css的属性值：

p(这个是一个标签选择器，用于选择到html中所有p标签) {
	color:red;
	这个是颜色选择器 冒号之后的是属性
	font-size:30px;
	字体大小为30px
	background-color:skyblue;
	背景颜色为skyblue
	width:300px;
	宽度为300px
	height:300px;
	高度为300px
}

下面我们来介绍一下选择器

一共有四种选择器
个人理解的选择器就是指，我们html中需要添加样式，但是在html标签里面写会显得代码不易改，不易阅读，我们就需要通过一种叫选择器的东西来连接一个html中的标签和样式属性，这样方式代码的阅读和后续的修改。

第一种就是标签选择器
在html中有很多个p标签或者a标签（任何标签都是一样的）。
我们就可以在书写css区域中写
举个例子：

        p{
            color: blue;
            font-size: 30px;
            background-color: skyblue;
            width: 300px;
            height: 300px;
        }

第二个就是类选择器
同样的我们举个例子：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .father {
            width: 400px;
            height: 400px;
            background-color: skyblue;
            margin: auto;
        }
        .son {
            width: 100px;
            height: 100px;
            background-color: orange;
            margin: auto;
        }
    </style>
</head>
<body>
    <div class="father">
        <div class="son"></div>
    </div>
</body>
</html>

第三个选择器的方式就是id选择器

#red{
    color: pink;
}
#one{
    color: rebeccapurple;
}

第四个选择器 叫 通配符选择器

        * {
            margin: 0;
            padding: 0;
        }

基本上实际开发中实际的用法：找到页面中的所有标签，设置样式，但是我们一般只用来去除浏览器自带的边框。

再介绍三个选择器的用法以及一些其他选择器吧
1.复合选择器中的后代选择器，子代选择器。
后代选择器：顾名思义后代选择器就是可以在选中一个元素中选择这个元素的后代元素，不论是子代还是孙代，还是重孙代……
举个例子：

        .father p {
            color: red;
        }

子代选择器：就是在已选中的元素的后面选中一个子代
还是举个例子：

        .father > p {
            color: red;
        }

2.并集选择器
它的作用是同时选择多组标签，设置一样的样式，重用代码让代码更加简洁。
并集选择器中每组选择器可以是基础选择器或者是复合选择器

        div,p {
            color: red;
        }

3.交集选择器
它的作用是找到是p标签，class类名还是red的标签，满足多个选择器的条件

        p.red {
            color: red;
        }

交集选择器如果有标签选择器，标签选择器需要写在最前面。

hover伪类选择器
它的作用是选中鼠标悬停在元素的状态

        a {
            width: 200px;
            height: 200px;
            text-decoration: none;
        }

        a:hover {
            color: orange;
        }

这样在鼠标经过a标签的时候，a标签所代表的元素的颜色属性会变成橙色。

结构伪类选择器
特点：根据元素在HTML中的结构关系中查找元素，常用于父级选择器中的子元素

E:first-child { } 匹配父元素中第一个子元素，并且是E元素
E:last-child { ) 匹配父元素中最后一个子元素，并且是E元素
E :nth-child(n){} 匹配父元素中第n个子元素，并且是E元素
E:nth-last-child(n){} 匹配父元素中倒数第n个子元素，并且是E元素
:nth-child 是指在所有孩子中数个数
:nth-of-type 是该类型找到符合的一堆子元素，在这一堆子元素中数个数

伪元素
特点：默认是行内元素
:before 是在父元素内容的最前添加一个伪元素
:after是在父元素内容的最后一个伪元素
注意：content 属性与 :before 及 :after 伪元素配合使用，来插入生成内容

链接伪类选择器
a:link { } 选中a链接未访问过的状态
a:visited { } 选中a链接访问之后的状态
a:hover { } 选中鼠标悬停的状态
a:active { ) 选中鼠标按下的状态

焦点伪类选择器
用于选中元素获得焦点时的状态，常用语表单控件

input:focus {
	background-color:skyblue;
}

属性选择器
选中HTML上面的属性来选中元素，常用与input标签
举个例子
选中页面中所有的文本框：
input[type=“text”] { }

样式

字体样式：
其中有几个比较重要的属性这个部分
字体大小：font-size 取值是 数字+px
字体粗细：font-weight 取值是 正常的值400 加粗的值700
字体样式：font-style 取值是 正常的值normal 倾斜的值italic
字体系列：font-family 取值是 取值是 具体字体1，具体字体2，具体字体3，具体字体4，具体字体5……
这种的意思呢是从左往右顺序查找，电脑未安装这个字体就显示下一个字体
如果自己用的样式重复了，系统默认的是执行最后一个
字体font属性的连写：font : style weight size family;

文本样式

  1. 文本缩进：text-indent 数学+px 或者 数学+em（em的意思是当前标签font-size的值，这种是取值方式是比较提倡的）
  2. 文本水平对齐方式：text-align 取值是left center right
  3. 文本修饰：text-decoration 取值是underline 下划线 none删除下划线等文本修饰使用text-decoration : none ; 清除a标签默认的下划线
  4. line-height控制一行的上下行间距
    网页精准布局时，会设置 line-height : 1 可以取消上下间距

水平居中样式
text-align : center
主要是让文本 span a input img 标签居中
margin： 0 auto；上下为间隔0 左右水平居中的意思 一般针对与固定宽度的盒子，大盒子没有设定宽度的话，那就是默认占满父元素的宽度 主要是让div p h（大盒子）水平居中
margin，padding都遵循上左下右
文字阴影text-shadow
h-shadow 水平偏移量，允许负值
v-shadow 垂直偏移量，允许负值
blur 模糊度
color 阴影颜色
盒子阴影box-shadow
h-shadow 必须，水平偏移量。允许负值
v-shadow 必须，垂直偏移量。允许负值
blur 可选，模糊度
spread 可选，阴影扩大
color 可选，阴影颜色
inset 可选，将阴影改为内部阴影

过渡
transition
过渡的属性all:所有能过渡的属性都过渡、[具体属性名如: width:只有width有过渡
过渡的时长 数字+s(秒)

颜色属性除了用颜色的英文字母表示，还可以用rgb和rgba来表示
介绍一下rgb的使用方法：
rgb ( 255 , 0 , 0 ) ：红色
rgb ( 0 , 255 , 0 ) ：绿色
rgb ( 0 , 0 , 255 ) ：蓝色
rgb ( 0 , 0 , 0 ) ：黑色
rgb ( 255 , 255 , 255 ) ：白色

rgba的使用方法就是在rgb的基础之上多一位数字，这个数字是控制颜色透明度的，可以写成0.5也可以写成.5
rgba ( 255 , 255 , 255 ,.5) ：透明度为0.5的白色

颜色还可以通过十六进制的表示法，一般可以通过在百度上面搜索十六进制颜色表示就可以按照自己的需求来选择自己所需要的颜色。

介绍背景相关的属性

background-color 设置为透明的颜色可以写为rgba(0,0,0,0),transparent
背景图片可以设置为：background-image:url(‘图片的路径’)
当然了背景图片的作业也仅仅是装饰一下，不可以撑开盒子的
背景是否平铺：background-repeat
这个我们一般属性值都写no-repeat
背景的位置background-position
这个属性的属性值可以取方位名词和数字+px（坐标）
background-size：宽度 高度；数字+px/百分比
contain 包含 将背景图片等比例缩放，直到不会超出盒子的最大
cover 覆盖 将背景图片等比例缩放，直到刚好填满整个盒子

最重要的背景相关属性连写形式就是
background：color image repeat position/size
举个例子：

background: violet url(../../HTML/day01/01.gif) no-repeat center center;

关于背景颜色还有一个渐变的效果

background-image: linear-gradient(
颜色1,
颜色2
);

元素显示模式

（这部分是我在学习完前端三大件中最要用但是不会的部分，建议多看看多写写多体会）

块级元素：属性display:block;
特点：独占一行，（宽度默认是父元素的，高度默认是由内容撑开，可以设置宽高）
常见标签：div p h系列 ul li dl form header nav footer等等

行内元素：属性：display:inline;
特点：一行可以显示多个，（宽度高度都由默认内容撑开，不可以设置宽高）
常见元素：a span

行内块元素：属性：display:inline-block
特点：一行可以显示多个，可以设置宽高
常见标签：input,textarea,button,select等等
注意：img有行内块元素的特点，但是Chrome调试工具中显示结果是inline

当然了可以转换我们各种元素的元素显示模式
操作方式：通过属性来更改就好了

HTML中的嵌套规范：
块级元素一般作为大容器来嵌套文本，块级元素，行内元素，行内块元素等等，但p标签不要嵌套div p h等块级元素
a标签内部可以嵌套任意元素，但a标签不能嵌套a标签

CSS三大特性
1.继承性 其实一般不怎么用
Inherited from 选择器
可以调试工具看有没有继承下来，有些属性继承不了
2.层叠性
设置了相同的属性，写在最后的生效
3.优先级
继承 < 通配符选择器 < 标签选择器 < 类选择器 < id选择器 < 行内样式 < !important
!important写在属性值后面，分号的前面

介绍一下css开发中常用的盒子模型
盒子模型中包括：内容区域：content 边框区域：border 内边距区域：padding 外边距区域：margin

内容区域：自然而然我们想到用width和height来设置内容区域的宽高
边框区域：可以设置边框粗细（border-width），边框样式（border-style），边框颜色（border-color），当然我们最常用还是连写 border：10px solid red;
也可以单独给单个方向的边框设置属性值
border-方位名词

内边距padding和外边距margin都有在方向设置上逆时针设置属性值的特点（上右下左）
属性值都是：数字+px

盒子实际大小计算
手动计算（不推荐）
盒子宽度=左边框+左padding+内容宽度+右padding+右边框
盒子高度=上边框+上padding+内容高度+下padding+下边框

自动内减（很推荐）
给盒子设置属性 box-sizing : border-box ;
浏览器会自动计算机多余大小，自动在内容中减去

CSS目前有一些问题现象：
现象：垂直布局的块级元素，上下的margin会合并，并且最后效果是取2个margin的最大值作用与两者之间的距离
解决办法：只给一个盒子设置margin

现象：互相嵌套的块级元素，子元素的margin—top会作用在父元素上导致父元素一起往下移动
解决办法：1.给父元素设置border-top或者padding-top
2.给父元素设置overflow：hidden
3.父元素转换为行内块元素
4.父元素设置浮动

现象：行内元素margin和padding无效情况：给行内元素设置margin和padding的时候，水平方向margin和padding布局中有效，垂直方向的margin和padding布局中无效。
暂无解决办法

多种布局方式

网页中图文环绕效果和网页中布局一些可以通过浮动属性来实现，现在我们来介绍一下这个浮动属性吧！

float:left;就是左浮动，相反 float:right;就是右浮动
特点：浮动元素会脱离标准流，可以覆盖标准流中的元素，浮动元素会受到上面元素边界的影响，浮动元素有特殊的显示效果：一行可以显示多个，可以设置宽高。（与行内块元素显示效果类似）
注意：浮动的元素不能通过text-align:center或者margin:0 auto，让浮动元素本身水平居中

与之对应的我们来学习一下清除浮动的操作
主要是因为，子元素然后浮动了，就不能撑开标准流的块级元素，子元素浮动后脱离标准流，不占位置，需要父元素有高度，不影响其他网页元素的布局。

清除浮动的操作：
直接设置父元素的高度

  1. 在父元素内容的最后添加一个块级元素（有待尝试）
  2. 给添加的块级元素设置 clear:both
  3. overflow:hidden;

定位
当我们盒子与盒子之间有层叠问题，或者说想让盒子始终固定在屏幕中一个位置，这时候我们大抵是要用到定位了

posittion:
后面可以跟 static 静态定位
relative 相对定位
absolute 绝对定位
fixed 固定定位
也可以跟方位 上下左右 数字+px

静态定位就是默认的，就是之前写到的标准流
不能移动
position:static;

相对定位 相对于自己之前的定位进行移动
position:relative;
需要配合方位属性实现移动
没有脱离标准流

绝对定位：相对于非静态定位的父元素进行定位
position:absolute
需要配合方位属性实现移动
脱离了标准流

建议使用 子绝父相
子元素是绝对定位，父元素是相对定位 这样对网页布局影响最小
父元素如果已经有了绝对定位，子元素也直接绝对定位就可以了

子绝父相方法：水平居中
1.先让父盒子往右盒子移动父元素的一半（left:50%;）
2.再让子盒子往左移动自己的一半（transform：translateX(-50%);）

使用translate实现绝对定位的元素居中效果

position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%,-50%);

这个translate还可以用来写2d移动的效果
3d移动效果transform: translate3d(x, y, z);

translate:rotate（角度）实现元素旋转的效果
当然空间旋转也不在话下
rotate3d(x, y, z, 角度度数)

现在的网页很少做3d效果了，就是有点傻傻的，之前很流行

固定定位：需要配合方位属性实现移动
position:fixed;
相对于浏览器的可视区域进行移动
不在标准流中

层级问题：标准流 < 浮动 < 定位
相对、绝对、固定默认层级相同
级别高的会覆盖上面的元素
也可以更改元素的层级
z-index:数字
数字越大，层级越高

布局还有一些比如说：
flex布局：
操作方式：父元素添加 display: flex，子元素可以自动的挤压或拉伸

使用justify-content调节元素在主轴（水平）的对齐方式
flex-start 默认值,起点开始依次排列
flex-end 终点开始依次排列
center 沿主轴居中排列
space-around 弹性盒子沿主轴均匀排列，空白间距均分在弹性盒子两侧
space-between 弹性盒子沿主轴均匀排列，空白间距均分在相邻盒子之间
space-evenly 弹性盒子沿主轴均匀排列，弹性盒子与容器之间间距相等

使用align-items调节元素在侧轴（竖直）的对齐方式
flex-start 默认值,起点开始依次排列
flex-end 终点开始依次排列
center 沿侧轴居中排列
stretch 默认值,弹性盒子沿着主轴线被拉伸至铺满容器

使用flex-direction改变元素排列方向
row 行,水平(默认值)
column *列,垂直
row-reverse 行,从右向左
column-reverse 列,从下向上

弹性盒子换行显示 : flex-wrap: wrap;
调整行对齐方式 ：align-content;

使用flex属性修改弹性盒子伸缩比
flex:数值

移动端网页的适配就是把我们之前的数值px换成rem或者是 vw和vh
1rem = 1HTML字号大小
使用媒体查询来设置差异化的css样式

@media (width: 320px) {
html {
font-size: 32px;}
}

可以把不同的视口宽度设置不同的rem的标准

/*视口宽度320px，根字号为32pX*/amedia (width: 320px) {
html {
font-size: 32px;}
}
/*视口宽度375px，根字号为37.5p× */media (width: 375px){
html i
font-size: 37.5px;}
}
/*视口宽度414px，根字号为41.4px*/amedia (width: 414px) {
html {
font-size: 41.4px;}
}

关于适配 还有提一下

less语法

需要在vscode上面安装Easy LESS这个插件
够使用Less嵌套写法生成后代选择器

.父级选择器{
//父级样式
.子级选择器{
/子级样式}
}

less变量来设置属性值
把颜色提前存储到一个容器，设置属性值为这个容器名

// 1，定义
@fontColor: pink;
//2．使用
.box {
color: @fontColor;
}
a {
color: @fontColor;
}

导入less文件（2中方式）
css中书写link标签
@import ’ base.less’;

框架：bootstarp

装饰：
垂直对齐方式：vertical-align
baseline 默认基线对齐
top 顶部对齐
middle 中部对齐
bottom 底部对齐

光标类型：cursor
default 默认，一般是箭头
pointer 小手效果，提醒用户可以进行点击
text 工字型 提醒用户可以选择文字
move 十字光标 提醒用户可以移动

圆角边角：border-radius
数字+px 百分比

overflow属性，溢出部分显示效果
visible 默认值 溢出部分课件
hidden 溢出部分隐藏
scroll 是否溢出都显示一个滚动条
auto 根据是否溢出 自动显示滚动条

元素本身的隐藏
visibility：hidden和display：none
在网页中占位置和在网页中不占位置
display属性可以完成none（隐藏）到block（显示）的切换

opacity元素整体的透明度，写数字0到1之间

画出一个三角形是利用盒子边框完成的

  1. 设置一个盒子
  2. 设置四周不同颜色的边框
  3. 将盒子宽高设置为0，仅保留边框
  4. 得到四个三角形，选择其中一个后，其他三角形（边框）设置颜色为透明

动画animation
定义动画：

@keyframes动画名称{
from {}
to {}

@keyframes动画名称{
0% {}
10%{}
15%{}
100% {}
}

animation:动画名称 动画时长 速度曲线 延迟时间 重复次数 动画方向 执行完毕时状态;

版心的设计

.container {width:1240px;margin: 0 auto;}

把页面的主体内容都约束在网页中间，不同大小的屏幕都能看到页面的主体内容
css的推荐书写顺序是：
1.布局属性
display . position .float . clear , visibility 、overflow
2.盒子模型+背景
width . height . margin . padding . border . background
3.文本内容属性
color 、font .text-decoration .text-align .line-height
4.点缀属性
cursor 、border-radius .text-shadow . box-shadow
开发中多用类+后代 不是层级越多越好，一般不超过三个

糕糕Pro
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
前端css学习ppt,总结详细
02-22
需要PPT模板的可以下载
HTML+CSS PPT
02-28
电子教案HTML+CSS 相关学习资料. 帮助您快速了解HTML CSS.
前端三大件HTML&CSS&JavaScript
weixin_45608986的博客
01-06 279
段落标签：<p>、<br> 标题标签：<h1>~<h6> img标签：<img src =" "/> 超链接：<a href = " ">文字</a> A标签的target属性： 标签 格式 _blank 在新打开、未命名的窗口打开链接 _parent 在父窗口打开链接 _self 在当前窗口打开链接 _top _top目标将会清除所有被包含的frame框架 ...
前端三剑客之css（超详细）
luka.lh的博客
01-28 466
目录一、概念二、基本语法规范三、引入方式1、内部样式表2、行内样式表3、外部样式四、选择器1、基础选择器2、复合选择器五、常用元素属性1、字体属性2、文本属性3、背景属性4、圆角矩形六、chrome调试工具-查看css属性1、打开方式2、各标签页含义3、elements标签页使用七、元素的显示模式1、块级元素2、行内元素（内联元素）3、区别4、改变显示模式八、盒模型1、边框2、内边距3、外边距4、去除浏览器默认样式九、弹性布局 一、概念 CSS(Cascading Style Sheets)层叠样式表，CS
CSS3-幻灯片
南乡人的博客
12-27 168
利用绝对定位和交错动画实现镜头拉伸背景效果 代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /&g...
03_前端三大件CSS
m0_52474839的博客
05-25 528
且div1被fixed到页面上，随着滚动条拖拽，div1的位始终不变。第一个div进行浮动设置后，轻轻松松往右进行漂浮。关于盒子的容量：加上边界 像素计算为102*102。绝对定位会随着浏览器边缘进行变化，我将浏览器缩小。盒子模型介绍的是如何调节div块之间的距离缝隙等。若选择器功能进行覆盖，那么后发生的为真实发生的。需求：我想让我的div块出现在指定的位置上。需求：我想让三个div盒子出现在同一行。fixed相对定位，其原始位置会被侵占。直接指定某个标签的样式，和上述一样。距离边缘位置距离不变。
前端三件套css学习笔记分享
02-24
前端三件套css学习笔记分享
前端三件套之一：css学习总结思维导图
04-02
个人总结，希望能有所帮助
前端开发之CSS原理详解
08-31
主要介绍了前端开发之CSS原理详解的相关资料,需要的朋友可以参考下
前端练习代码之css2.1
04-12
练习代码——前端学习
前端学习代码之-css3
04-12
前端学习代码之-css3练习代码
高级css解析,CSS样式的高级应用解析.ppt
weixin_42237925的博客
08-04 97
CSS样式的高级应用解析20.3.2 设置层裁切——clip 接上页 20.3.2 设置层裁切——clip 网页效果 20.3.2 设置层裁切——clip 效果说明 层裁切的矩形区域坐标值说明，上坐标10像素是指矩形的上边距网页上边的距离；右坐标6厘米是指矩形的右边距网页左边的距离为6厘米；下坐标80像素是指矩形的下边距网页的上边的距离；左坐标12像素是指矩形的左边距网页左边的距离为12像素...
黑马前端笔记3--CSS（1）
weixin_51584115的博客
01-27 594
黑马前端笔记3--CSS（1）
前端三大件基本介绍——HTML、CSS、JavaScript
qq_52207529的博客
07-04 3569
想要学习前端开发，HTML、CSS、JavaScript三大件是我们必须要学习的内容，在学完这三大件后我们就可以自主写出一些比较好看的网页。 我们看到的每一个网页主要由三部分组成：结构、表现和行为。 其中，HTML用来表示结构，决定网页的结构和内容（“是什么”）；CSS用来表示表现（样式），设定网页的表现样式（“什么样子”）；JavaScript用来表示行为， 控制网页的行为（“做什么”）；所以我们说这三大件是我们制作网页所必备的知识。 HTML HTML指超文本标记语言，主要用来写网页的框架结
[Vue-常见错误]浏览器显示Uncaught runtime errors
一个喜欢什么都研究一下的小小后端程序员
06-09 359
在vue.config.js中配置关闭Uncaught runtime errors显示。
JS中一个dom元素能绑定多少事件
ggq53219的博客
06-10 521
在JavaScript中，一个DOM元素可以绑定的事件数量并没有明确的限制，这主要取决于浏览器的实现和内存限制。然而，在实际应用中，为同一个DOM元素绑定过多的事件监听器可能会导致性能问题，尤其是在事件处理函数执行复杂操作的情况下。总之，虽然JavaScript中DOM元素可以绑定的事件数量没有明确的限制，但在实际应用中应注意避免过度绑定和优化事件处理函数，以确保良好的性能和用户体验。
Web前端网站设计案例：深入剖析创意与技术的完美融合
最新发布
liyrbtqe_66w的博客
06-12 244
在性能优化方面，设计师通过压缩代码、减少HTTP请求、使用CDN等技术手段，提升了网站的加载速度和响应性能，为用户提供了更加流畅的访问体验。综上所述，本Web前端网站设计案例通过视觉设计、用户体验、技术实现、性能优化、创意表达、响应式设计和跨平台兼容等方面的综合考量，成功打造了一款既美观又实用的网站。这个案例充分展示了Web前端设计的魅力和潜力，为未来的网站设计提供了有益的借鉴和启示。设计师通过独特的视觉元素和创意构思，将品牌理念和文化内涵融入其中，使得整个网站在传达信息的同时，也展现出品牌的独特魅力。
前端导入normalize.css
05-17
要导入 normalize.css，可以按照以下步骤操作： 1. 下载 normalize.css 文件，可以从官网下载或者使用 npm 安装：`npm install normalize.css` 2. 在 HTML 文件中，在 `<head>` 标签内添加以下代码： ```html <link rel="stylesheet" href="path/to/normalize.css"> ``` 其中 `path/to/normalize.css` 是 normalize.css 文件的路径。 3. 确保 normalize.css 在其他 CSS 样式文件之前引入，这样可以确保 normalize.css 的样式优先级高于其他样式。 4. 重新加载 HTML 页面，检查样式是否生效。 这样就可以成功导入并使用 normalize.css 了。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值