CSS3之opacity属性的简单使用

CSS3之opacity属性的简单使用什么是opacity?opacity属性设置元素的不透明级别。 怎么使用?<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title> CSS3之opacity属性的简单使用</title&gt

大家好,又见面了,我是你们的朋友全栈君。

什么是opacity?

opacity 属性设置元素的不透明级别。

 

怎么使用?

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>	CSS3之opacity属性的简单使用</title>
    <style>
        div {
            width: 100px;
            height: 100px;
            background-color: red;
            margin: 0 auto;

            /*
            opacity 属性设置元素的不透明级别。
            本元素的不透明度是 0.5。请注意,文本和背景色都受到不透明级别的影响。
            取值范围:从 0.0 (完全透明)到 1.0(完全不透明)。

            详细见:http://www.w3school.com.cn/cssref/pr_opacity.asp
            */
            opacity: 0.5;
        }
    </style>
</head>
<body>
    <div>
        opacity属性的简单使用
    </div>

</body>
</html>

 

效果图:

CSS3之opacity属性的简单使用

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/141344.html原文链接:https://javaforall.net

赞 (0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • cde网站_cde6150a车床

    cde网站_cde6150a车床给定一个 m x n 整数矩阵 matrix ,找出其中 最长递增路径 的长度。对于每个单元格,你可以往上,下,左,右四个方向移动。 你 不能 在 对角线 方向上移动或移动到 边界外(即不允许环绕)。示例 1:输入:matrix = [[9,9,4],[6,6,8],[2,1,1]]输出:4 解释:最长递增路径为 [1, 2, 6, 9]。示例 2:输入:matrix = [[3,4,5],[3,2,6],[2,2,1]]输出:4 解释:最长递增路径是 [3, 4, 5, 6]。注意

    2022年8月11日
  • windows的安装_kafka windows安装

    windows的安装_kafka windows安装一、安装JAVAJDK1、下载安装包http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html注意:根据32/64位操作系统下载对应的安装包2、添加系统变量:JAVA_HOME=C:\ProgramFiles(x86)\Java\jdk1.8.0_144二、安装Zo…

    2022年10月9日
  • js实现replaceAll方法

    js实现replaceAll方法js本来有replace方法,请看w3school的说明:replace()方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。语法:stringObject.replace(regexp/substr,replacement)第一个参数为一个字符串或者一个正则表达式,第二个参数为一个字符串或者一个用于生成字符串的函数。注意重点:如果regexp…

    2022年7月23日
  • Android setDisplayOptions 具体的使用说明

    Android setDisplayOptions 具体的使用说明

    2022年1月11日
  • rc522读卡器电路_stm32烧录工具

    rc522读卡器电路_stm32烧录工具在写这篇文章之前有写过一篇有关于PN532的文章,RC522与PN532在使用上都可以用来读写我们之前用的M1的IC卡,并且两款芯片有着同样都是应用于13.56MHz的非接触式通信芯片等诸多共通之处,查阅网上资料对于两者的区别个人认为RC522属于RFID,而PN532属于NFC,在功能上PN532包含了RC522的所功能(个人愚见),并且对于大部分需要量产使用或者学生党来说…

    2022年9月19日
  • h5实现长按复制文本_ios13如何复制链接

    h5实现长按复制文本_ios13如何复制链接前段时间有位朋友让帮忙做一个手机h5页面长按复制的功能,先上图安卓实现起来没问题,有时候ios会报错,无奈手边也没有iPhone手机,折腾了好几次才完成,直接上关键代码<scriptsrc=”js/jquery.ui.draggable.js”type=”text/javascript”></script><scripttype=”text/…

    2022年9月29日

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号