在css中有很多好看的样式都可以实现,css设置出来的样式让整个网页看起来也会非常美观,今天的这篇文章就给大家来介绍一下在css中怎么设置字体的透明度,让你的字体在网页中看起来是透明的。

首先小编在这里谢谢大家一直的支持,每天都会更新十个web前端基础内容,需要的可以关注我,另外也可以进我的web学习交流群1045267283,领取资料学习资料笔记,可以跟里面的小伙伴一起学习一起成长,不懂的问题也可以问我,随时给大家解答。再次感谢大家。

在css3中新增了一个rgba属性,所谓rgba属性,就是R(红)G(绿)B(蓝)三原色加ALPHA(透明度),下面我们就来具体看看这个rgba属性如何设置字体透明度。

首先利用RGBA来设置背景颜色透明度是非常简单的,我们来简单看一个例子:

<!DOCTYPE html>
<html>
<head><title></title><style type="text/css">
.div{background-color:rgba(220,38,38,0.2);width:100px;height:100px;
}
</style>
</head>
<body>
<div class="div">我是文字
</div>
</body>
</html>

RGBA来设置背景颜色透明度的效果如下:

上述代码是不是很简单,那么如果将字体设置透明度我们可以如何利用RGBA呢?

其实也非常简单,设置字体的透明度,我们可以对color的rgba属性进行设置。

我们来看RGBA设置字体透明度的具体示例:

<!DOCTYPE html>
<html>
<head><title></title><style type="text/css">
.div{background:red;width:100px;height:100px;color:rgba(255,255,255,0.4)
}</style>
</head>
<body>
<div class="div">我是透明文字
</div>
</body>
</html>

字体透明度的效果如下:

本篇文章到这里就全部结束了,需要更多内容关注我!

CSS字体透明度怎么设置?相关推荐

  1. css字体设置透明度,CSS字体透明度怎么设置?

    在css中有很多好看的样式都可以实现,css设置出来的样式让整个网页看起来也会非常美观,今天的这篇文章就给大家来介绍一下在css中怎么设置字体的透明度,让你的字体在网页中看起来是透明的. 在css3中 ...

  2. html的font字号1-7,CSS 字体大小font-size设置

    CSS font-size字体文字大小样式属性-字体大小样式篇: 本节DIVCSS7为大家介绍通过CSS样式设置文字字体大小知识,涉及CSS样式单词font-size. 一.设置字体大小CSS单词与语 ...

  3. css 背景效果_css透明度怎么设置?三种css图片透明度的设置方法

    css透明度的设置在网页的设计中是经常需要用到的,有时为了设计出的网页更加的美观,会对图片进行透明化处理,这样网页上面的内容就不会看不见,有的网页因为图片作为背景,也会更加美观,那么,css中的透明度 ...

  4. css背景透明(css背景透明度怎么设置)

    CSS 背景颜色透明怎么弄 外层div: background-color: rgba(255, 255, 255, 0.9); /* 白色并且阿尔法通道是0.9*/ 内层div: backgroun ...

  5. CSS字体默认样式设置

    //1. 字体族: 表示一堆字体的东西 分类如下 衬线字体 serif 宋体就是衬线字体  带有弯弯勾勾的样子 非衬线字体sans-serif  不带有弯弯勾勾的样子 monospace  等宽字体  ...

  6. html css字体样式颜色,css字体颜色怎么设置?

    在CSS中想要设置字体颜色,可以使用color属性.color属性规定文本的颜色:该属性设置了一个元素的前景色:光栅图像不受 color 影响. css要设置一个元素的前景色(在 HTML 表现中,就 ...

  7. html5纯css字体大小自适应设置

    css 字体大小自适应样式设置篇 字体可以设置大小使用css font-size来实现,有时需要对字体大小根据浏览器分辨率来判断后自适应大小. 在CSS 2.0中字体大小自适应是难实现的,一般使用JS ...

  8. html css字体样式颜色,css字体颜色如何设置?

    在网页开发的过程中,有时为了网页的美观,需要给网页中的字体设置不同的颜色.那么怎么设置字体颜色呢?下面本篇文章就来给大家来介绍一下使用CSS设置字体颜色的方法,希望对大家有所帮助. 在CSS中,可以使 ...

  9. css 字体字符间距设置

    css 字间距,使用css来控制字与字之间距离,也叫css字间距方法. 使用到的css样式属性单词text-indent抬头距离,letter-spacing字与字间距. Css字间距.div css ...

最新文章

  1. 第二次作业:王者荣耀软件分析
  2. 【学术相关】海外博士一般朝九晚五,国内博士动辄十几个小时科研时间。为什么普遍认为海外博士水平比较高?...
  3. win10 linux安卓模拟器,genymotion安卓模拟器在Window10中使用的问题
  4. 优化Meta讨好搜索引擎 更好的提升网站排名
  5. 排序算法之交换排序(冒泡排序、快速排序)
  6. 希尔排序法(插入排序的改进版本)
  7. 关于用Linux桌面版当工作系统这件事
  8. mysql——时间字段类型与C#中datetime
  9. redmine 自己定义字段mysql表结构
  10. 获取SD卡上 未安装 APK文件信息
  11. 同表复制一条数据,除主键外,其他值相同
  12. OpenStack icehouse系列之问题处理
  13. python安装pyqt4_PyQt4 64位下载 PyQt4 for python2.7 v4.8.5 64位 windows 官方简体中文安装版 下载-脚本之家...
  14. 业务太忙,真的是没时间搞自动化理由吗?
  15. 小孔子内容管理系统第一次更新
  16. 怎么用dos系统进入服务器,怎么进入dos_如何进入dos的方法(图文介绍)
  17. datetime instant 转_java8 Date Localdatetime instant 相互转化(转) 及当天的最大/最小时间...
  18. lighttpd移植
  19. Swing设置窗体背景图片
  20. Mysql组复制(MGR)——前提及限制

热门文章

  1. macOS中快速打开终端
  2. python 小数乘法_TMS320C55xDSP应用系统设计
  3. HDF5 header version 1.10.4与HDF5 library 1.10.5冲突解决办法记录
  4. 网页的缩放,适配以及移动的适配!
  5. div的水平排列、垂直排列
  6. css气泡图片上下浮动
  7. 微信公告号 图灵机器人实现智能回复
  8. 68 ping: Lacking privilege for raw socket.
  9. Xcode怎么退回旧版本?
  10. 搭建 Nexus 私服