摘要：
radial-gradient() 函数创建一个<image>，用来展示由原点（渐变中心）辐射开的颜色渐变 -默认均匀分布 radial-gradient(red,blue); -不均匀分布 radial-gradient(red 50%,blue 70%); -改变渐变的形状 radial-gra 阅读全文
posted @ 2021-07-06 21:08
leiyanting
阅读(322)
评论(0)
推荐(0)
摘要：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content 阅读全文
posted @ 2021-07-06 20:27
leiyanting
阅读(100)
评论(0)
推荐(0)
摘要：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content 阅读全文
posted @ 2021-07-06 19:52
leiyanting
阅读(161)
评论(0)
推荐(0)
摘要：
线性渐变 为了创建一个线性渐变，你需要设置一个起始点和一个方向（指定为一个角度）。你还要定义终止色。终止色就是你想让浏览器去平滑的过渡过去，并且你必须指定至少两种，当然也会可以指定更多的颜色去创建更复杂的渐变效果。 -默认从上到下发生渐变 linear-gradient(red,blue); -改变 阅读全文
posted @ 2021-07-06 16:53
leiyanting
阅读(123)
评论(0)
推荐(0)
摘要：
background-size 设置背景图片大小 默认值：auto auto 不可继承 值： 百分比： 指定背景图片相对背景区（background positioning area）的百分比。背景区由background-origin设置，默认为盒模型的内容区与内边距 auto： 以背景图片的比例 阅读全文
posted @ 2021-07-06 16:28
leiyanting
阅读(277)
评论(0)
推荐(0)
摘要：
border-box 指定背景延伸到边框的外部边缘。边框下方绘制了背景。这是默认值。 从边框开始剪裁 padding-box 指定背景延伸到填充的外部边缘。边框下方未绘制背景。 从填充区开始剪裁 content-box 指定仅在内容框内（剪切到）绘制背景。在边框和填充区域下方未绘制背景。从内容区开始 阅读全文
posted @ 2021-07-06 16:24
leiyanting
阅读(247)
评论(0)
推荐(0)
摘要：
background-origin 设置背景的渲染的起始位置 可选值: border-box 从边框开始渲染 padding-box 从内填充区域开始渲染 content-box 从内容区开始渲染 阅读全文
posted @ 2021-07-06 16:09
leiyanting
阅读(131)
评论(0)
推荐(0)
摘要：
百分比：参照尺寸为背景图片定位区域的大小减去背景图片的大小 如果定位区域大小是 height:200px width:200px 图片的大小是 width:100px height:120px 那么10%就是 (200px-100px)*10% 与 (200px-120px)*10% 阅读全文
posted @ 2021-07-06 15:52
leiyanting
阅读(95)
评论(0)
推荐(0)
摘要：
background-attachment 决定背景是在视口中固定的还是随包含它的区块滚动的。 默认值：scroll 不可继承 值： fixed 此关键字表示背景相对于视口固定。即使一个元素拥有滚动机制，背景也不会随着元素的内容滚动 。 相当于背景定位到了视口元素 scroll 此关键字表示背景相对 阅读全文
posted @ 2021-07-06 15:48
leiyanting
阅读(54)
评论(0)
推荐(0)
摘要：
border-image CSS属性允许在元素的边框上绘制图像。。这使得绘制复杂的外观组件更加简单，使用 border-image 时，其将会替换掉 border-style 属性所设置的边框样式 默认值： 不可继承 border-image-source: none border-image-sl 阅读全文
posted @ 2021-07-06 15:37
leiyanting
阅读(142)
评论(0)
推荐(0)
摘要：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content 阅读全文
posted @ 2021-07-06 14:54
leiyanting
阅读(75)
评论(0)
推荐(0)
摘要：
传统的圆角生成方案，必须使用多张图片作为背景图案 CSS3圆角的出现，使得我们再也不必浪费时间去制作这些图片了，而且还有其他多个优点： * 减少维护的工作量。图片文件的生成、更新、编写网页代码，这些工作都不再需要了。 * 提高网页性能。由于不必再发出多余的HTTP请求，网页的载入速度将变快。 * 增 阅读全文
posted @ 2021-07-06 11:06
leiyanting
阅读(95)
评论(0)
推荐(0)
摘要：
resize CSS 属性允许你控制一个元素的可调整大小性。（一定要配合overflow：auto使用） 默认值：none 不可继承 值： none 元素不能被用户缩放。 both 允许用户在水平和垂直方向上调整元素的大小。 horizontal 允许用户在水平方向上调整元素的大小。 vertica 阅读全文
posted @ 2021-07-06 10:49
leiyanting
阅读(137)
评论(0)
推荐(0)
摘要：
box-sizing 属性用于更改用于计算元素宽度和高度的默认的 CSS 盒子模型。可以使用此属性来模拟不正确支持CSS盒子模型规范的浏览器的行/列为。 默认值：content-box 不可继承 值 content-box 默认值，标准盒子模型。 width 与 height 只包括内容的宽和高， 阅读全文
posted @ 2021-07-06 10:48
leiyanting
阅读(161)
评论(0)
推荐(0)
摘要：
/* left是倒影的方向 10px是倒影距离本体元素的距离 */ -webkit-box-reflect: left 10px; 阅读全文
posted @ 2021-07-06 10:33
leiyanting
阅读(142)
评论(0)
推荐(0)
摘要：
vertical-align: middle; 属性设置元素的垂直对齐方式。 可选值: middle:把此元素放置在父元素的中部。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-U 阅读全文
posted @ 2021-07-06 10:21
leiyanting
阅读(163)
评论(0)
推荐(0)
摘要：
div{ position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; height: 100px; width: 100px; } 阅读全文
posted @ 2021-07-06 09:58
leiyanting
阅读(37)
评论(0)
推荐(0)
摘要：
box-shadow 以逗号分割列表来描述一个或多个阴影效果，可以用到几乎任何元素上。 如果元素同时设置了 border-radius ，阴影也会有圆角效果。多个阴影时和多个 text shadows 规则相同(第一个阴影在最上面)。 默认值: none 不可继承 值： inset 默认阴影在边框外 阅读全文
posted @ 2021-07-06 09:56
leiyanting
阅读(509)
评论(0)
推荐(0)
浙公网安备 33010602011771号