![](https://img-blog.csdnimg.cn/20201014180756738.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
CSS
weixin_42834788
这个作者很懒,什么都没留下…
展开
-
CSS基础
1.现在HTML只有一个作用就是用来添加语义,所有的格式,样式都有CSS来完成。2.通过CSS来修改样式有什么好处? 不用记忆哪些属性属于哪个标签 当需求变更时我们不需要修改大量的代码就可以满足需求 在前端开发中CSS只有一个作用, 就是用来修改样式3.CSS的格式<style type="text/css">...原创 2019-07-18 15:04:36 · 62 阅读 · 0 评论 -
边框知识点汇总
一、边框属性1.什么边框?边框就是环绕在标签宽度和高度周围的线条2.边框属性的格式2.1连写(同时设置四条边的边框)border: 边框的宽度 边框的样式 边框的颜色;快捷键:bd+ border: 1px solid #000;注意点:1.连写格式中颜色属性可以省略, 省略之后默认就是黑色2.连写格式中样式不能省略, 省略之后就看不到边框了3.连写格式中宽度可以省略, 省...原创 2019-07-19 10:55:27 · 586 阅读 · 0 评论 -
盒子模型的知识点汇总
一、盒子模型1.什么是CSS盒子模型?CSS盒子模型仅仅是一个形象的比喻, HTML中所有的标签都是盒子结论1.在HTML中所有的标签都可以设置宽度/高度 == 指定可以存放内容的区域内边距 == 填充物边框 == 手机盒子自己外边距 == 盒子和盒子之间的间隙<style> span,a,b,strong{ di...原创 2019-07-19 17:27:32 · 518 阅读 · 0 评论 -
浮动基础知识点
一、网页的排版方式1.什么是网页的布局方式?网页的布局方式其实就是指浏览器是如何对网页中的元素进行排版的1.标准流(文档流/普通流)排版方式1.1其实浏览器默认的排版方式就是标准流的排版方式1.2在CSS中将元素分为三类, 分别是块级元素/行内元素/行内块级元素1.3 在标准流中有两种排版方式, 一种是垂直排版, 一种是水平排版垂直排版, 如果元素是块级元素, 那么就会垂直排版水...原创 2019-07-20 09:01:12 · 444 阅读 · 0 评论 -
清除浮点的方式
一、浮点元素高度问题1.在标准流中内容的高度可以撑起父元素的高度2.在浮动流中浮动的元素是不可以撑起父元素的高度的<style> *{ margin: 0; padding: 0; } div{ border: 1px solid #000; ...原创 2019-07-20 15:44:58 · 618 阅读 · 0 评论 -
定位流的知识
一、相对定位1.定位流分类1.1相对定位1.2绝对定位1.3固定定位1.4静态定位2.什么是相对定位?相对定位就是相对于自己以前在标准流中的位置来移动3.相对定位注意点3.1相对定位是不脱离标准流的, 会继续在标准流中占用一份空间3.2在相对定位中同一个方向上的定位属性只能使用一个3.3由于相对定位是不脱离标准流的, 所以在相对定位中是区分块级元素/行内元素/行内块级元素...原创 2019-07-22 15:16:27 · 196 阅读 · 0 评论 -
a标签的伪元素
1.通过我们的观察发现a标签存在一定的状态1.1默认状态, 从未被访问过1.2被访问过的状态1.3鼠标长按状态1.4鼠标悬停在a标签上状态2.什么是a标签的伪类选择器?a标签的伪类选择器是专门用来修改a标签不同状态的样式的3.格式:link 修改从未被访问过状态下的样式:visited 修改被访问过的状态下的样式:hover 修改鼠标悬停在a标签上状态下的样式:active ...原创 2019-07-22 16:13:45 · 1253 阅读 · 0 评论 -
过度模块
一、过度模块1,过渡三要素1.1必须要有属性发生变化1.2必须告诉系统哪个属性需要执行过渡效果1.3必须告诉系统过渡效果持续时长2.注意点当多个属性需要同时执行过渡效果时用逗号隔开即可transition-property: width, background-color;transition-duration: 5s, 5s;<style> ...原创 2019-07-22 16:51:39 · 104 阅读 · 0 评论 -
2D转换模式
一、2D转换模式 <style> *{ margin: 0; padding: 0; } ul{ width: 800px; height: 500px; border: 1px solid #000; ...原创 2019-07-22 20:15:12 · 203 阅读 · 0 评论 -
背景有关知识点
一、背景尺寸属性1.什么是背景尺寸属性背景尺寸属性是CSS3中新增的一个属性, 专门用于设置背景图片大小<style> *{ margin: 0; padding: 0; } ul{ width: 800px; height: 50...原创 2019-07-23 21:20:44 · 153 阅读 · 0 评论 -
3D转换模块
一、3D转换模块1.什么是2D和3D2D就是一个平面, 只有宽度和高度, 没有厚度3D就是一个立体, 有宽度和高度, 还有厚度默认情况下所有的元素都是呈2D展现的2.如何让某个元素呈3D展现和透视一样, 想看到某个元素的3d效果, 只需要给他的父元素添加一个transform-style属性, 然后设置为preserve-3d即可<style> ...原创 2019-07-23 19:57:52 · 95 阅读 · 0 评论 -
CSS背景和精灵图
一、背景颜色1.如何设置标签的背景颜色?在CSS中有一个background-color:属性, 就是专门用来设置标签的背景颜色的取值:具体单词rgbrgba十六进制快捷键:bc background-color: #fff;<style> div{ width: 500px; height:...原创 2019-07-19 08:50:30 · 95 阅读 · 0 评论 -
CSS文字属性
1.规定文字样式的属性格式:font-style: italic;取值:normal : 正常的, 默认就是正常的italic : 倾斜的快捷键:fs font-style: italic;fsn font-style: normal;2.规定文字粗细的属性格式: font-weight: bold;单词取值:bold 加粗bolder 比加粗还要粗lighter 细...原创 2019-07-18 15:26:45 · 561 阅读 · 2 评论 -
CSS文本属性和颜色属性
一.文本属性1.文本装饰的属性格式:text-decoration: underline;取值:underline 下划线line-through 删除线overline 上划线none 什么都没有, 最常见的用途就是用于去掉超链接的下划线快捷键:td text-decoration: none;tdu text-decoration: underline;tdl tex...原创 2019-07-18 15:35:57 · 1139 阅读 · 0 评论 -
CSS选择器
1.什么是标签选择器?作用: 根据指定的标签名称, 在当前界面中找到所有该名称的标签, 然后设置属性格式:标签名称{ 属性:值;}注意点:1.标签选择器选中的是当前界面中所有的标签, 而不能单独选中某一个标签2.标签选择器无论标签藏得多深都能选中3.只要是HTML中的标签就可以作为标签选择器(h/a/img/ul/ol/dl/input....)<style...原创 2019-07-18 16:11:38 · 109 阅读 · 0 评论 -
几个选择器的区别
一、id选择器和类选择器的区别1.id和class的区别?1.1id相当于人的身份证不可以重复class相当于人的名称可以重复1.2一个HTML标签只能绑定一个id名称一个HTML标签可以绑定多个class名称2.id选择器和class选择器区别?id选择器是以#开头class选择器是以.开头3.在企业开发中到底用id选择器还是用class选择器?id一般情况下是给js使...原创 2019-07-18 16:17:45 · 646 阅读 · 0 评论 -
CSS的三大特性
一、继承性1.什么是继承性?作用: 给父元素设置一些属性, 子元素也可以使用, 这个我们就称之为继承性注意点:1.并不是所有的属性都可以继承, 只有以color/font-/text-/line-开头的属性才可以继承2.在CSS的继承中不仅仅是儿子可以继承, 只要是后代都可以继承3.继承性中的特殊性3.1a标签的文字颜色和下划线是不能继承的3.2h标签的文字大小是不能继承的应用...原创 2019-07-18 16:24:30 · 97 阅读 · 0 评论 -
优先级中的important和权重问题
一、important问题1.什么是!important作用: 用于提升某个直接选中标签的选择器中的某个属性的优先级的, 可以将被指定的属性的优先级提升为最高注意点:1.!important只能用于直接选中, 不能用于间接选中2.通配符选择器选中的标签也是直接选中的3.!important只能提升被指定的属性的优先级, 其它的属性的优先级不会被提升4.!important必须写在属...原创 2019-07-18 16:30:29 · 1370 阅读 · 0 评论 -
div和span标签
1.什么是div?作用: 一般用于配合css完成网页的基本布局,一般在开发网页过程中,我们都需要先进行局部的块划分,划分的块级元素就要使用div标签2.什么是span?作用: 一般用于配合css修改网页中的一些局部信息3.div和span有什么区别?1.div会单独的占领一行,而span不会单独占领一行2.div是一个容器级的标签, 而span是一个文本级的标签4.容器级的标签和文本...原创 2019-07-18 20:03:56 · 1006 阅读 · 0 评论 -
CSS元素的显示模式及模式转换
一、模式显示在HTML中HTML将所有的标签分为两类, 分别是容器级和文本级在CSS中CSS也将所有的标签分为两类, 分别是块级元素和行内元素1.什么是块级元素, 什么是行内元素?块级元素会独占一行行内元素不会独占一行容器级的标签div h ul ol dl li dt dd ...文本级的标签span p buis stong em ins del ...块级元素p di...原创 2019-07-18 20:11:54 · 667 阅读 · 0 评论 -
动画模块
一、动画模块1.过渡和动画之间的异同1.1不同点过渡必须人为的触发才会执行动画动画不需要人为的触发就可以执行动画1.2相同点过渡和动画都是用来给元素添加动画的过渡和动画都是系统新增的一些属性过渡和动画都需要满足三要素才会有动画效果<style> *{ margin: 0; padding: 0;...原创 2019-07-23 11:42:58 · 250 阅读 · 0 评论