2021年11月21日

10-4.高斯模糊和饱和度
摘要： 滤镜属性：使用的是filter属性 高斯模糊和饱和度 高斯模糊： 1.filter：blur（合法的尺寸单位）； 2.合法的尺寸单位可以是px em rem ... 3.默认值是0，数值越大图像越模糊 4.不能使用百分比做单位 饱和度： 1.filter：saturate（百分比）； 2.默认值是1 阅读全文
posted @ 2021-11-21 23:57 Walker-Yang 阅读(68) 评论(0) 推荐(0)
10-3.鼠标样式
摘要： 鼠标样式： 1.使用的是cursor属性 2.书写格式：cursor：值； 3.pointer 手型 wait 等待 help 问号 4.auto 默认值，文本编辑光标 阅读全文
posted @ 2021-11-21 23:42 Walker-Yang 阅读(42) 评论(0) 推荐(0)
10-2.表格属性
摘要： 表格属性： 1.设置表格相邻单元格之间的间隔，使用的是border-spacing属性 书写格式：border-spacing：水平间隔，垂直间隔； 2.单元格边框折叠的设置，使用的是collapse属性 书写格式：border-collapse：值； separate 默认值 表示单元格边框之间不 阅读全文
posted @ 2021-11-21 22:41 Walker-Yang 阅读(130) 评论(0) 推荐(0)
10-1.列表属性
摘要： 列表属性： 1.列表标识：list-style-type:标志类型； 2.标志位置：list-style-position：值； outside 默认值 表示标志在列表项之外 inside 表示标志在列表项之内 3.设置自定义标志图标：list-style-image:url("图片路径")； 4. 阅读全文
posted @ 2021-11-21 22:27 Walker-Yang 阅读(62) 评论(0) 推荐(0)
9-9.元素居中及样式重置
摘要： 元素居中及样式重置： 1.元素水平居中：margin：0 auto；只对块级元素有效 2.行级元素和行内块级元素水品居中使用text-algin：center； 属性需要写在父元素中才会生效 3.内外边距重置语法：使用通用选择器，设置padding：0；margin：0； 阅读全文
posted @ 2021-11-21 22:19 Walker-Yang 阅读(29) 评论(0) 推荐(0)
9-8.溢出隐藏
摘要： 溢出隐藏： 1.使用overflow属性 2.书写格式：overflow：值； 3.visible 默认值 内容不会被修剪，会显示在元素框之外 4.hidden 表示内容会被修剪，显示在元素框之外的部分会被隐藏 5.scroll 表示内容会被修剪，同时会显示滚动条，拖动滚动条以便观察溢出的内容 6. 阅读全文
posted @ 2021-11-21 22:08 Walker-Yang 阅读(178) 评论(0) 推荐(0)
9-7.box-sizing属性
摘要： box-sizing属性 1.正常情况下，元素的内边距和边框会在元素设置的宽度和高度之外进行绘制 2.为了解决这个问题，需要使用box-sizing属性，书写格式：box-sizing：值； 3.content-box 默认值，表示元素的内边距和边框会在元素设置的宽度和高度之外进行绘制 4.bord 阅读全文
posted @ 2021-11-21 21:59 Walker-Yang 阅读(94) 评论(0) 推荐(0)
9-6.内边距和边框踩坑
摘要： 内边距和边框踩坑： 1.当一个元素同时设置有内边距和边框时，元素的领地会向外扩展，从而挤压出额外的空间 2.其他元素会挤到下一行进行排列 阅读全文
posted @ 2021-11-21 21:39 Walker-Yang 阅读(30) 评论(0) 推荐(0)
9-5.内边距设置
摘要： 内边距设置： 1.内边距的两大要素：方向和距离大小 2.所有元素都可以设置内边距，不像外边距那样有很多坑，所以一般情况下尽量使用内边距 3.方向：left左 right右 top上 bottom下 4.距离大小：合理的尺寸单位，px em rem 百分比 4.书写格式：padding-方向：内边距大 阅读全文
posted @ 2021-11-21 21:35 Walker-Yang 阅读(195) 评论(0) 推荐(0)
9-4.外边距踩坑
摘要： 外边距踩坑：针对的是不同类型的元素之间或者相同元素之间发生的事情 1.元素上下排列时，上下边距会合并，上下边距取最大值 2.当元素左右排列时，两个元素的左右边距会叠加，左右边距会相加 3.行级元素只有左右外边距，没有上下外边距 4.行内块级元素和块级元素外边距四个方向都有效 阅读全文
posted @ 2021-11-21 21:24 Walker-Yang 阅读(31) 评论(0) 推荐(0)
9-3.外边距简写
摘要： 外边距简写： 1.margin：值1 值2 值3 值4； 2.当四个值都设置时，外边距的值依次是上top，右right，下bottom，左left， 按顺时针方向进行设置 3.当设置三个值时，外边距的值依次是上top，右左left right ，下bottom，他们是对边的关系 4.当设置二个值时， 阅读全文
posted @ 2021-11-21 20:57 Walker-Yang 阅读(69) 评论(0) 推荐(0)
9-2.外边距设置
摘要： 外边距设置： 1.外边距的两大要素：方向和距离大小 2.方向：left左 right右 top上 bottom下 3.距离大小：合理的尺寸单位，px em rem 百分比 4.书写格式：margin-方向：外边距大小； 5.使用百分比时，参考的是父元素宽度或者高度的百分比 6.可以使用负值，使用正值 阅读全文
posted @ 2021-11-21 20:56 Walker-Yang 阅读(250) 评论(0) 推荐(0)
9-1.盒子模型初识
摘要： 盒子模型初识： 1.所有的元素都可以有宽高 2.所有元素都是一个矩形 3.所以元素可以看成一个盒子 4.盒子包括：外边距+边框+内边距+元素内容 阅读全文
posted @ 2021-11-21 20:44 Walker-Yang 阅读(45) 评论(0) 推荐(0)
8-8.轮廓和样式重置
摘要： 轮廓和样式重置 轮廓：位于边缘之外，会加在边框之外 1.使用的是outline属性 2.书写格式和使用方法基本和边框一样 3.outline：轮廓宽度 轮廓样式 轮廓颜色； 样式重置 1.文本输入框，多行文本，下拉列表的样式重置 2.outline：none; 阅读全文
posted @ 2021-11-21 20:10 Walker-Yang 阅读(26) 评论(0) 推荐(0)
8-7.边框阴影
摘要： 边框阴影： 1.使用的是box-shadow属性 2.书写格式：box-shadow：值1 值2 值3 值4 值5 3.值1，必须有，设置边框阴影的水平距离，可以使用合法的尺寸单位：px em rem %...，可以是正值，也可以是负值 4.值2，必须有，设置边框阴影的垂直距离，可以使用合法的尺寸单 阅读全文
posted @ 2021-11-21 20:01 Walker-Yang 阅读(57) 评论(0) 推荐(0)
8-6.圆角边框设置
摘要： 圆角边框设置： 圆角边框的两大要素：方向和半径 书写格式：border-垂直方向（上下）-水平方向（左右）-radius:水平方向的半径，垂直方向的半径； 圆角的方向： 注意：圆角的方向选择的是先上下，再左右 1.border-top-left-radius 表示选中的是上左角，默认值 2.bord 阅读全文
posted @ 2021-11-21 19:53 Walker-Yang 阅读(517) 评论(0) 推荐(0)
8-5.圆角边框的两大要素
摘要： 圆角边框的两大要素：方向和半径 1.方向：先垂直方向，再水平方向 2.半径：水平方向的半径和垂直方向的半径 阅读全文
posted @ 2021-11-21 18:03 Walker-Yang 阅读(28) 评论(0) 推荐(0)
8-4.边框方向
摘要： 边框的四要素：边框的方向，边框的宽度，边框的颜色，边框的样式 边框的方向：需要写在属性名中，在border-之后 1.四个方向：left 左 top上 bottom下 right右 2.四个方向设置一样的边框，只需要把方向取消即可，使用最多的方法 阅读全文
posted @ 2021-11-21 17:45 Walker-Yang 阅读(33) 评论(0) 推荐(0)
8-3.边框样式
摘要： 边框四要素：边框的宽度，边框的颜色，边框的样式，边框的方向 边框样式： 1.solid 表示的是实线， 使用最多，一定要记住 2.dashed 表示的是虚线 3.dotted 表示的是点状线 4.double 表示双划线 5.边框的宽度，边框的颜色，边框的样式写在属性值中，中间使用空格隔开，他们的位 阅读全文
posted @ 2021-11-21 17:31 Walker-Yang 阅读(69) 评论(0) 推荐(0)
8-2.边框宽度和边框颜色
摘要： 边框设置： 1.边框四要素：边框的宽度，边框的颜色，边框的样式，边框的方向 2.边框的宽度：可以使用px em rem （注意：百分比无效），推荐使用像素px 3.边框颜色：颜色值，可以是颜色名称 16进制颜色值 rgb和rgba都可以使用 阅读全文
posted @ 2021-11-21 17:28 Walker-Yang 阅读(116) 评论(0) 推荐(0)
8-1.边框设置
摘要： 边框设置： 1.边框四要素：边框的宽度，边框的颜色，边框的样式，边框的方向 阅读全文
posted @ 2021-11-21 16:30 Walker-Yang 阅读(51) 评论(0) 推荐(0)
7-7.背景简写
摘要： 背景简写： 1.使用的是background属性 2.书写格式：background：背景颜色 背景图片 背景重复 背景定位/背景尺寸 背景固定； 3.可以在一个属性中书写多个属性值，属性值之间使用空格隔开 4.使用背景简写，使用的代码数量少，浏览器对背景简写的支持度高 阅读全文
posted @ 2021-11-21 15:55 Walker-Yang 阅读(54) 评论(0) 推荐(0)
7-6.背景固定
摘要： 背景固定： 1.使用的是background-attachment属性，设置背景图片是否随页面的滚动而移动 2.书写格式：background-attachment：值； 3.scroll 默认值，表示背景图片会随页面的滚动而移动 4.fixed 表示背景图片不会随页面的滚动而移动 阅读全文
posted @ 2021-11-21 15:45 Walker-Yang 阅读(22) 评论(0) 推荐(0)
7-5.背景定位
摘要： 背景定位： 1.使用的是background-position属性 2.书写格式：background-position：值1 值2； 3.值1：x方向 水平方向，也可以使用方向定位left左 right右 center 居中 4.值2：y方向 垂直方向，也可以使用方向定位top左 bottomt右 阅读全文
posted @ 2021-11-21 15:40 Walker-Yang 阅读(132) 评论(0) 推荐(0)
7-4.背景尺寸
摘要： 背景尺寸： 1.使用的是background-size属性 2.书写格式：background-size：值1 值2； 3.值1：表示设置背景图片的宽度，合法尺寸单位：px em rem %... 4.值2：表示设置背景图片的高度,合法尺寸单位：px em rem %... 5.使用%时，是按照父元 阅读全文
posted @ 2021-11-21 15:24 Walker-Yang 阅读(170) 评论(0) 推荐(0)
7-3.背景重复
摘要： 背景重复： 1.使用的是background-repeat属性 2.书写格式：background-repeat：值； 3.repeat 默认值 表示重复 4.no-repaet 表示不重复 5.repeat-x 表示水平方向重复 6.repeat-y 表示垂直方向重复 阅读全文
posted @ 2021-11-21 15:10 Walker-Yang 阅读(27) 评论(0) 推荐(0)
7-2.背景图片
摘要： 背景图片： 1.使用的是background-image属性 2.书写格式：background-image：url（“图片路径”）； 3.这里的图片路径可以是绝对路径，也可以是相对路径 4.背景图片和背景颜色可以一起生效，两者互不影响 5.默认值是none，表示空，没有背景图片 阅读全文
posted @ 2021-11-21 15:03 Walker-Yang 阅读(23) 评论(0) 推荐(0)
7-1.背景颜色
摘要： 背景颜色： 1.使用的是background-color属性 2.书写格式：background-color：合法的颜色值； 3.合法的颜色值可以使用颜色名，16进制颜色值，rgb和rgba颜色值 4.当没有设置颜色值时，默认是透明背景，默认值是transparent 阅读全文
posted @ 2021-11-21 12:45 Walker-Yang 阅读(76) 评论(0) 推荐(0)
6-8.rgb和rgba颜色值
摘要： rgb颜色值： 1.使用rgb颜色值：通过定义三种颜色的强度来定义一个颜色 r表示红色，取值范围0-255 g表示绿色，取值范围0-255 b表示蓝色，取值范围0-255 2.三个值之间使用英文状态下的逗号隔开 1.rgba颜色值：通过定义三种颜色的强度+一个透明的来定义一个颜色 r表示红色，取值范 阅读全文
posted @ 2021-11-21 12:29 Walker-Yang 阅读(1306) 评论(0) 推荐(0)
6-7.颜色名和16进制颜色值
摘要： 颜色名： 1.html和css规范中定义了147种可用的颜色名称 2.颜色名称是使用最少的表示方式 16进制颜色值： 1.表达方式：#rrggbb rr(红色) gg（绿色） bb（蓝色） 2.取值范围：16进制整数来规定颜色成分，所有取值必须在00-ff范围之间 3.纯红色：#ff0000 纯绿色 阅读全文
posted @ 2021-11-21 12:25 Walker-Yang 阅读(245) 评论(0) 推荐(0)
6-6.百分比
摘要： 百分比： 1.百分比参考是父元素，是父元素的百分比 2。当父元素大小发生改变时，使用百分比为单位的子元素的大小也会随着改变 阅读全文
posted @ 2021-11-21 12:14 Walker-Yang 阅读(519) 评论(0) 推荐(0)
6-5.rem单位
摘要： rem单位： 1.rem为单位时，参考是根元素html的字体大小作为参考，一个rem表示一个根元素的字体大小 2.当根元素的字体大小发生改变时，所有以rem为单位设置的尺寸单位都会发生相应的变化 阅读全文
posted @ 2021-11-21 10:37 Walker-Yang 阅读(52) 评论(0) 推荐(0)

导航