![](https://img-blog.csdnimg.cn/20201014180756780.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
CSS
文章平均质量分 73
何北木
这个作者很懒,什么都没留下…
展开
-
CSS3-其它特性
1. web字体和字体图标1.1 web字体概述:用户电脑上没有安装相应字体,强制让用户下载该字体(浏览器临时性自动下载网页编写者给定在CSS中的字体文件)步骤:提供需要生成字体的字体文件内容使用网络资源生成web字体,然后下载并解压到本地;如阿里巴巴icofont字体图标网站把解压的字体文件复制到,项目的font文件夹中把下载到的字体代码复制到css文件中 /*代码格式:*/ @font-face{ font-family:"字体名";原创 2020-11-27 02:47:13 · 295 阅读 · 0 评论 -
CSS3-弹性布局篇
1. flex弹性布局1.1 概述布局的传统解决方案,基于盒状模型,依赖 display属性 + position属性 + float属性。它对于那些特殊布局非常不方便。CSS3在布局方面做了非常大的改进,使得我们对块级元素的布局排列变得十分灵活,适应性非常强,其强大的伸缩性,在响应式开中可以发挥极大的作用。别名:伸缩布局=弹性布局=伸缩盒布局=弹性盒布局=flex布局1.2 布局原理flex 是 flexible Box 的缩写,意为弹性布局,用来为盒状模型提供最大的原创 2020-11-27 02:45:27 · 768 阅读 · 0 评论 -
CSS3-过渡、变形、动画
1. 过渡在CSS3里使用 transition 可以实现补间动画(过渡效果)速写语法transition:要过渡的属性、花费时间、运动曲线、何时开始。/*如果有多组属性变化,用逗号隔开*/设置过渡属性名称transition-property :要过渡属性的名称(如width)设置过渡花费时间transition-duration :过渡花费的时间(默认是0,时间单位为s/秒)设置过渡时间曲线transition-timing-function :规定过渡效果的时间曲线默认是ea原创 2020-11-27 02:39:39 · 455 阅读 · 0 评论 -
CSS3-背景篇
1. 文本阴影text-shadowtext-shadow属性还没有出现时,大家在网页设计中阴影一般都是用photoshop做成图片现在有了css3可以直接使用 text-shadow属性来指定阴影这个属性可以有两个作用:产生阴影和模糊主体。这样在不使用图片时能给文字增加质感语法:text-shadow :x轴偏移 y轴偏移 模糊距离 阴影颜色;// (必须)x、y轴取正负值 如5px、-5px// (可选)模糊距离必须取正值如:5px// (可选)阴影颜色为色值,也可以是rgba透明色原创 2020-11-27 02:31:53 · 364 阅读 · 0 评论 -
CSS3-选择器篇
1. CSS3概述如同人类的的进化一样,CSS3是CSS2的进化版本,在CSS2基础上,增强或新增了许多特性, 弥补了CSS2的众多不足之处,使得Web开发变得更为高效和便捷css当js用js当后台语言用2. CSS3现状浏览器支持程度差,需要添加私有前缀(移动端)a). -webkit- 谷歌(Google)b). -moz- 火狐(Firefox)c). -o- 欧鹏(Opera)d). -ms- IE(Internet Explorer)e). -khtml-原创 2020-11-27 02:12:20 · 164 阅读 · 0 评论 -
CSS高级技巧篇
1. 鼠标样式cursor设置或检索在对象上移动的鼠标指针采用何种系统预定义的光标形状。 属性 属性值 作用 cursor: default 白箭头原创 2020-06-22 16:10:44 · 475 阅读 · 0 评论 -
CSS之常规流、浮动、定位篇
1. 视觉格式化模型(布局规则)盒模型为规定单个盒子的规则,视觉格式化模型(布局规则)页面中的多个盒子排列规则,视觉格式化模型大体上将页面中盒子的排列分为三种方式:常规流浮动定位2. 常规流布局不同的名称为常规流、文档流、普通文档流、常规文档流所有元素默认情况下,都属于常规流布局总体规则:块盒独占一行,行盒水平依次排列2.1 常规流盒子的包含块包含块(containing block):每个盒子都有它的包含块,包含块决定了盒子的排列区域绝大部分情况下:盒子的包含块为其父原创 2020-06-22 13:27:49 · 350 阅读 · 0 评论 -
CSS背景(background)篇
1. background概述CSS 可以添加背景颜色和背景图片,以及来进行图片设置。属性描述background-color:背景颜色background-image:背景图片地址background-repeat:是否平铺background-position:背景位置background-attachment:背景固定还是滚动2. background-image设置背景图background-image:url("imgs/main原创 2020-06-21 17:25:19 · 15393 阅读 · 0 评论 -
CSS三大特性篇
1. CSS三大特性概述层叠 、继承 、优先级 是我们学习CSS 必须掌握的三个特性。2. CSS层叠性所谓层叠性是指多种CSS样式的叠加。是浏览器处理冲突的一个能力,如果一个属性通过两个相同选择器设置到同一个元素上,那么这个时候一个属性就会将另一个属性层叠掉比如先给某个标签指定了内部文字颜色为红色,接着又指定了颜色为蓝色,此时出现一个标签指定了相同样式不同值的情况,这就是样式冲突。一般情况下,如果出现样式冲突,则会按照CSS书写的顺序,以最后的样式为准。样式冲突,遵循的原则是就近原则原创 2020-06-21 16:48:07 · 227 阅读 · 0 评论 -
CSS盒模型篇
1. 盒模型概述box:盒子,每个元素在页面中都会生成一个矩形区域(盒子)盒子类型:块盒、行盒、行块盒2. 块盒(块级元素)块盒:display:bolck每个块元素通常都会独自占据一整行或多整行可以对其设置宽度、高度、对齐等属性,常用于网页布局和网页结构的搭建总是从新行开始高度,行高、外边距以及内边距都可以控制。宽度默认是容器的100%可以容纳内联元素和其他块元素。 序号原创 2020-06-21 16:12:17 · 343 阅读 · 0 评论 -
CSS选择器篇
1. 选择器概述要想将CSS样式应用于特定的HTML元素,首先需要找到该目标元素。在CSS中,执行这一任务的样式规则部分被称为选择器(选择符)。如上图所以,要把里面的小黄人分为2组,最快的方法怎办?很多, 比如 一只眼睛的一组,剩下的一组选择器干啥的? 选择标签用的这就用到基础选择器组:2 标签选择器标签选择器是指用HTML标签名称作为选择器,按标签名称分类,为页面中某一类标签指定统一的CSS样式。其基本语法格式如下:1 | <!-- 标签选择器 可以把某一类标签全部选择出来 div原创 2020-06-21 15:23:33 · 263 阅读 · 0 评论 -
CSS外观属性篇
1. color:文本颜色color属性用于定义文本的颜色,其取值方式有如下3种:1.预定义的颜色值,如red,green,blue等。2.十六进制,如#FF0000,#FF6600,#29D794等。实际工作中,十六进制是最常用的定义颜色的方式。3.RGB代码,如红色可以表示为rgb(255,0,0)或rgb(100%,0%,0%)。需要注意的是,如果使用RGB代码的百分比颜色值,取值为0时也不能省略百分号,必须写为0%。 属性 预定义的颜色值 十六进制值 r原创 2020-06-21 14:58:01 · 234 阅读 · 0 评论 -
CSS字体样式篇
1. CSS字体样式属性1.1 font-size:字号大小font-size属性用于设置字号,该属性的值可以使用相对长度单位,也可以使用绝对长度单位。其中,相对长度单位比较常用,推荐使用像素单位px,绝对长度单位使用较少。具体如下:1.2 font-family:字体font-family属性用于设置字体。网页中常用的字体有宋体、微软雅黑、黑体等,例如将网页中所有段落文本的字体设置为微软雅黑,可以使用如下CSS样式代码:1 | p{ font-family:"微软雅黑";}注: 可以同时指原创 2020-06-21 14:10:43 · 7011 阅读 · 0 评论 -
CSS之初识篇
1. CSS的发展历程从HTML被发明开始,样式就以各种形式存在。不同的浏览器结合它们各自的样式语言为用户提供页面效果的控制。最初的HTML只包含很少的显示属性。随着HTML的成长,为了满足页面设计者的要求,HTML添加了很多显示功能。但是随着这些功能的增加,HTML变的越来越杂乱,而且HTML页面也越来越臃肿。于是CSS便诞生了。CSS的出现,拯救了混乱的HTML,当让更加拯救了我们web开发者。 让我们的网页更加丰富多彩。2. CSS初识CSS(Cascading Style Sheet原创 2020-06-21 13:04:06 · 147 阅读 · 0 评论