如何使用CSS属性中的样式和透明度设置元素样式

2025-04-23 07:58:37

1、第一步,在打开的HBuilderX工具中,新建一个静态页面并插入一个div和十个子div,如下图所示:

如何使用CSS属性中的样式和透明度设置元素样式
如何使用CSS属性中的样式和透明度设置元素样式

2、第二步,使用类选择器和元素选择器,设置div标签的样式,如宽度、高度、行高、文字居中等,如下图所示:

如何使用CSS属性中的样式和透明度设置元素样式

3、第三步,保存代码并直接打开浏览器预览界面效果,可以看到十个圆圈,如下图所示:

如何使用CSS属性中的样式和透明度设置元素样式

4、第四步,再使用nth-of-type,然后分别设置多个div元素的背景颜色,如下图所示:

如何使用CSS属性中的样式和透明度设置元素样式

5、第五步,再次保存代码并打开浏览器预览效果,可以发现元素显示背景色,如下图所示:

如何使用CSS属性中的样式和透明度设置元素样式

6、第六步,再次使用nth-child,这个属性中添加序号,分别设置div标签的透明度,如下图所示:

如何使用CSS属性中的样式和透明度设置元素样式
声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢