opacity属性的应用

opacity属性的应用opacity是CSS中很有意思的属性,类似于Photoshop中不透明度的更改,结合绝对定位能实现很多漂亮的效果。opacity取值范围为0-1,若实现对IE浏览器的兼容,一般写为filter: alpha(opacity=XX);

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

        opacity是CSS中很有意思的属性,类似于Photoshop中不透明度的更改,结合绝对定位能实现很多漂亮的效果。

        opacity取值范围为0-1,若实现对IE8 以及更早的版本的兼容,一般写为filter: alpha(opacity=XX);当然其他geek会有更强大的写法,本文不再赘述。

    从网页设计的角度来讲,制作半透明效果有以下几个方法:

    一是采用绝对定位,把半透明图层覆盖到原图层上。这是使用最多的方法,用于轮播图,或者图片说明文字的底色。半透明的图层加上js代码即可实现透明到不透明的渐变,以及图层的移动。

    二是使用半透明的png图像,覆盖到原图层上。这种方法的好处是能够形成半透明的纹理,做出特殊的半透明效果。

    三是使用多个半透明图层的叠加。类似于photoshop图层叠加的效果,这种方法的好处是结合js实现简单的动画,增强图片的吸引力。

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

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

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


相关推荐

  • 【STM32】UART和USART的区别[通俗易懂]

    【STM32】UART和USART的区别[通俗易懂]1、UART:universalasynchronousreceiverandtransmitter通用异步收发器;2、USART:universalsynchronousasynchronousreceiverandtransmitter通用同步异步收发器。1、通用异步收发器:通用异步收发器是一种通用串行数据总线,用于异步通信。该总线双向通信,可以实现全双工传…

    2022年5月19日
    38
  • python少儿趣味编程案例(python少儿编程书)

    Python简单易学,功能强大,是少儿学习编程的首选语言。本书是少儿学习Python编程的趣味指南,全书共17章,按照由简到难、逐步深入的方式组织各章内容。本书从认识Python开始,首先介绍了Python的安装和IDLE的使用,然后依次介绍了变量、数字和字符串、列表、元组和字典、布尔类型等数据类型,以及条件、循环、异常和注释、函数、面向对象编程、文件操作等基础知识,并且通过实际案例讲解了海龟绘图…

    2022年4月10日
    44
  • linux未找到 ftp命令,Linux服务器ftp命令找不到「建议收藏」

    linux未找到 ftp命令,Linux服务器ftp命令找不到「建议收藏」ftpcommondnotfind先用命令rpm-qvsftpd检查是否安装了ftp服务器若显示vsftpd-2.2.2-11.el6_4.1.x86_64这样的信息,说明FTP服务器已安装,那为什么FTP命令不能用呢,那是FTP客户端没安装的缘故。下载ftp-0.17-51.1.el6.x86_64.rpm,下载地址有:http://rpm.pbone.net/index.php3/s…

    2025年11月28日
    8
  • 二叉树abcdefghij先序遍历_二叉树后序遍历的非递归算法

    二叉树abcdefghij先序遍历_二叉树后序遍历的非递归算法给定一个二叉树,判断其是否是一个有效的二叉搜索树。假设一个二叉搜索树具有如下特征:节点的左子树只包含小于当前节点的数。节点的右子树只包含大于当前节点的数。所有左子树和右子树自身必须也是二叉搜索树。题解深搜/** * Definition for a binary tree node. * struct TreeNode { * int val; * TreeNode *left; * TreeNode *right; * TreeNode() :

    2022年8月9日
    6
  • lspci 安装_ipswme下载的系统如何安装

    lspci 安装_ipswme下载的系统如何安装在原版的busy-box做出来的文件系统中,lspci命令只有两个选项:ynq>lspci-hlspci:invalidoption–‘h’BusyBoxv1.20.1(2012-11-2713:37:12MST)multi-callbinary.Usage:lspci[-mk]ListallPCIdevices-m

    2025年10月17日
    4
  • mysql数据库忘记密码时如何修改(本地)「建议收藏」

    mysql数据库忘记密码时如何修改(本地)「建议收藏」mysql数据库忘记密码时如何修改(本地)

    2022年4月24日
    59

发表回复

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

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