html中怎么设置字体透明度_心得技巧

上一篇: vue中插件和组件的区别是什么下一篇:html的盒子模型有几种

html中怎么设置字体透明度

发布时间：2022-05-17 发布网站：脚本宝典

脚本宝典收集整理的这篇文章主要介绍了html中怎么设置字体透明度，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

htML中设置字体透明度的方法：1、利用color属性和rgba()函数，语法为“字体元素{color: rgba(红色值, 绿色值, 蓝色值, 透明度值);}”；2、利用OpacITy属性，语法“字体元素{opacity:透明度值;}”。

html中怎么设置字体透明度

本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。

html中设置字体透明度的方法：

1、利用color属性和rgba()函数

<!DOCTYPE html>
<html>
	<head>
		<;meta charset="UTF-8">
		<style>
			.p1{
				color: rgba(0, 0, 0, 1);
			}
			.p2{
				color: rgba(0, 0, 0, 0.6);
			}
			.P3{
				color: rgba(0, 0, 0, 0.4);
			}
			.p4{
				color: rgba(0, 0, 0, 0.2);
			}
			
		</style>
	</head>
	<body bgcolor="#AFEEEE">
		<p class="p1">测试文本</p>
		<p class="p2">测试文本</p>
		<p class="p3">测试文本</p>
		<p class="p4">测试文本</p>
	</body>
</html>

html中怎么设置字体透明度

2、利用opacity属性

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<style>
			.p1{
				opacity:1;
			}
			.p2{
				opacity: 0.6;
			}
			.p3{
				opacity:0.4;
			}
			.p4{
				opacity:0.2;
			}
			
		</style>
	</head>
	<body bgcolor="#00aa7f">
		<p class="p1">测试文本</p>
		<p class="p2">测试文本</p>
		<p class="p3">测试文本</p>
		<p class="p4">测试文本</p>
	</body>
</html>

html中怎么设置字体透明度

脚本宝典总结

以上是脚本宝典为你收集整理的html中怎么设置字体透明度全部内容，希望文章能够帮你解决html中怎么设置字体透明度所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。

标签：html

上一篇: vue中插件和组件的区别是什么下一篇:html的盒子模型有几种

猜你在找的心得技巧相关文章

clion结合vcpkg以及GTest的使用 2022-07-07
EGF 2022-06-06
ExtJS 布局-Column布局（Column layout） 2022-06-05
颜色之ARGB与RGB、RGBA的区别与介绍 2022-04-15
rgba中的a是什么意思 CSS之RGBA颜色指南 2022-04-15
rootfs -根文件系统制作 2022-07-07
网页简单布局之结构与表现原则分享 2022-04-15
小项目中怎么防止Vue的闪现画面效果 2022-04-15
隐藏 Web 中的元素方法及优缺点教程详解 2022-04-15
告别硬编码让你的前端表格自动计算的实例代码 2022-04-15