趣百科

如何使用CSS3中的属性设置元素的内阴影并显示

编辑:Simone 2025-01-28 13:08:49 553 阅读

如何使用CSS3中的属性设置元素的内阴影并显示

在我们使用CSS3中的属性box-shadow,如果设置inset以及正数值,这样形成的阴影就是内阴影;如果设置为负数,这样就形成外阴影。下面利用实例说明,操作如下:

第一步,双击打开HBuilderX工具,并新建一个HTML5模板,修改title内容,如下图所示:

第二步,在标签内,插入一个div标签并设置class属性,如下图所示:

第三步,接着使用,设置页面全局的样式,如内外边距、字体属性,如下图所示:

第四步,再使用类选择器shadow,设置宽度、高度、边框和椭圆角,如下图所示:

第五步,保存代码并打开浏览器预览界面效果,可以发现一个椭圆角的边框,如下图所示:

第六步,再在类选择器中,添加box-shadow属性,兼容不同浏览器的,如下图所示:

版权声明:本站【趣百科】文章素材来源于网络或者用户投稿,未经许可不得用于商用,如转载保留本文链接:https://www.qubaik.com/answer/125671.html

相关推荐