编辑
2023-03-20
CSS3
0
请注意,本文编写于 593 天前,最后修改于 571 天前,其中某些信息可能已经过时。

目录

边框与圆角
轮廓
参数
特点
投影
用途
参数
特点

边框与圆角

border边框

css
div { /*四个值,顺时针排列*/ border-radius: top right bottom left; /*两个值,第一个值表示左上和右下,第二个值表示左下和右上*/ border-radius: a b; /*三个值,上、左右、下*/ border-radius:2px 1px 2px; }

轮廓

css
outline: :outline-color, outline-style, outline-width;

参数

outline-color: 规定边框的颜色
outline-style:规定边框的样式
outline-width: 规定边框的宽度
inherit: 规定应该从父元素继承

特点

  1. 轮廓不会占据位置,不会影响附近边框

投影

用途

用于设置元素投影

css
div { box-shadow: innset x-shadow y-shadow blur spread color }

参数

inset:内部阴影
x-shadow: 水平方向投影,为0时左右两侧投影相等
y-shadow: 竖直方向投影,为0时上下两侧投影相等
blur: 模糊半径(值越大,模糊效果越强)
spread: 阴影尺寸
color: 投影颜色

特点

  1. 不会影响元素位置

本文作者:RKLS

本文链接:

版权声明:本博客所有文章除特别声明外,均采用 BY-NC-SA 许可协议。转载请注明出处!