css中box-shadow属性

àì夳堔傛蜴生んèń 2022-09-03 09:25 82阅读 0赞

# 外边框： #

box-shadow: 0 0 8px rgb(0, 204, 255);

![20210806162909857.png][]

<div
            style="
              width: 100px;
              height: 100px;
              box-shadow: 0 0 8px rgb(0, 204, 255);
            "
          ></div>

# 内边框： #

只需在前面加个 **inset **即可

box-shadow: inset 0 0 8px rgb(0, 204, 255);

![20210806163047622.png][]

<div
            style="
              width: 100px;
              height: 100px;
              box-shadow: inset 0 0 8px rgb(0, 204, 255);
            "
          ></div>

#  外边框+内边框： #

box-shadow: inset 0 0 8px rgb(0, 204, 255), 0 0 8px rgb(0, 204, 255);

![20210806163207113.png][]

<div
            style="
              width: 100px;
              height: 100px;
              box-shadow: inset 0 0 8px rgb(0, 204, 255), 0 0 8px rgb(0, 204, 255);
            "
          ></div>

[20210806162909857.png]: /images/20220829/2744c613831a405f979c8581af5c3163.png
[20210806163047622.png]: /images/20220829/e32c45bdbe8546ce87bca615f5e97e83.png
[20210806163207113.png]: /images/20220829/075531c804e549ec8e75f8fc971f8db5.png

发表评论取消回复

表情：

评论列表（有 0 条评论，82人围观）

还没有评论，来说两句吧...

相关阅读

相关 CSS中常用属性

/ 作者：呆萌老师 ☑csdn认证讲师 ☑51cto高级讲师 ☑腾讯课堂认证讲师 ☑网易云课堂认证讲师 ☑华为开发者学堂

浅浅的花香味﹌/ 2024年04月07日 11:56/ 0 赞/ 76 阅读

相关 css中display属性区别

display 属性区别 display:block 占据一整行，如果固定宽度，则会以margin的形式展现 display: inline 占据自己的一部

Dear 丶/ 2023年10月11日 09:43/ 0 赞/ 11 阅读

相关 CSS中字体样式属性

font-family属性的部分属性值 <p><span style="font-family:STXinwei"> hello world</span>华文新魏

淡淡的烟草味﹌/ 2023年10月03日 11:37/ 0 赞/ 28 阅读

相关 CSS中的contenteditable属性

contenteditable属性：使一个元素变为可编辑的状态 contenteditable="true" 开启文本编辑 conten

Love The Way You Lie/ 2023年03月13日 02:23/ 0 赞/ 5 阅读

相关 css 相同的css属性_CSS中的标题侧属性

css 相同的css属性 CSS | 字幕端属性 (CSS | caption-side Property) Introduction: 介绍： We deal w

绝地灬酷狼/ 2023年03月05日 12:54/ 0 赞/ 11 阅读

相关 css opacity属性_CSS中的opacity属性

css opacity属性 CSS | 不透明度属性 (CSS | opacity Property) With the growing need of making

冷不防/ 2023年03月05日 09:59/ 0 赞/ 10 阅读

相关 css中box-shadow属性

外边框： box-shadow: 0 0 8px rgb(0, 204, 255); ![20210806162909857.png][] <div

àì夳堔傛蜴生んèń/ 2022年09月03日 09:25/ 0 赞/ 83 阅读

相关 css中display属性详解

display属性值: none 此元素不会被显示。 block 此元素将显示为块级元素，此元素前后会带有换行符。 inline 默认。此元

冷不防/ 2022年08月21日 13:37/ 0 赞/ 265 阅读

相关 CSS中属性排序

From: http://markdotto.com/2011/11/29/css-property-order/ CSS property order No

╰半橙微兮°/ 2022年08月20日 06:10/ 0 赞/ 172 阅读

相关 HTML boxShadow 单边阴影，双边阴影

box-shadow语法：x轴偏移值 y轴偏移值模糊半径阴影半径 || 颜色 insect，其中阴影半径可以为负值，意思是增加或减少指定数值的阴影半径正常阴影 box-

末蓝、/ 2022年04月06日 06:13/ 0 赞/ 283 阅读