≡
  • 网络编程
  • 数据库
  • CMS技巧
  • 软件编程
  • PHP笔记
  • JavaScript
  • MySQL
位置:首页 > 网络编程 > HTML

HTML 为元素添加一些透明度的简单方法

人气:1954 时间:2018-11-01

这篇文章主要为大家详细介绍了HTML 为元素添加一些透明度的简单方法,具有一定的参考价值,可以用来参考一下。

感兴趣HTML 为元素添加一些透明度的简单方法的小伙伴,下面一起跟随四海网的小编罗X来看看吧。<br>
<!------>
 
<!-- a little bit css here: -->
<style type="text/css" media="all">
 
    td { vertical-align: top; }
 
    #table {
        margin: 0 auto;
        width: 300px;
    }
 
    .red_box {
        width: 100px; 
        height: 100px; 
        background-color: #7A1417;
    }
 
</style>
 
 <!-- 512-笔记网 www.q1010.com -->
<!-- a table with some images and divs -->
<table border="0" cellpadding="5" cellspacing="2" id="table">
    <tr>
        <td valign="top">    
            90 % opacity<br/>
            <img src="/lab/context_free/t008.png" 
            style="filter: Alpha(opacity=90); opacity: .9;" />
        </td>
 
        <td>        
            50 % opacity<br/>
            <img src="/lab/context_free/t008.png" 
            style="filter: Alpha(opacity=50); opacity: .5;" />
        </td>
 
        <td>
            20 % opacity<br/>
            <img src="he/lab/context_free/t008.png" 
            style="filter: Alpha(opacity=20); opacity: .2;" />
        </td> 
 
    </tr>
 
    <tr>       
        <td>
            90 % opacity<br/>
            <div class="red_box" 
            style="filter: Alpha(opacity=90); opacity: .9;" /></div>
        </td>
 
        <td>    
            50 % opacity<br/>
            <div class="red_box" 
            style="filter: Alpha(opacity=50); opacity: .5;" /></div>
        </td>
 
        <td>       
            20 % opacity<br/>
            <div class="red_box" 
            style="filter: Alpha(opacity=20); opacity: .2;" /></div>
        </td>        
    </tr>
 
</table>
 

本文来自:http://www.q1010.com/175/2821-0.html

注:关于HTML 为元素添加一些透明度的简单方法的内容就先介绍到这里,更多相关文章的可以留意四海网的其他信息。

关键词:透明度

您可能感兴趣的文章

  • php 缩放png图片保持透明度功能实例
  • php 图片处理类:支持缩放、剪切、相框、水印、锐化、旋转、翻转、透明度、反色
  • PHP 图片处理类详解:水印、透明度、缩放、相框、锐化、旋转、翻转、剪切、反色
上一篇:html 回到顶部的完整代码
下一篇:CSS分页符示例
热门文章
  • HTML5 文本内容显示三行,多余部分显示...,点击全部展开
  • HTML,CSS,font-family:中文字体和英文名称对照表
  • html 回到顶部的完整代码
  • 百度编辑器ueditor自动排版首行缩进四个字符实现方法
  • HTML 为元素添加一些透明度的简单方法
  • HTML/CSS 实现div居中、div内部元素垂直居中的简单示例
  • HTML 在textarea中选择文本的实现方法
  • CSS分页符示例
  • 【推荐】DIV+CSS入门菜鸟教程
  • HTML 点击超链接在iframe框架显示的实现方法
  • 最新文章
    • css实现移动端禁止手机长按图片弹出保存图片
    • 鼠标拖动DIV元素的实现方法
    • html 标签随机变色大小的简单示例
    • HTML 在textarea中选择文本的实现方法
    • CSS分页符示例
    • HTML 为元素添加一些透明度的简单方法
    • html 回到顶部的完整代码
    • HTML5 文本内容显示三行,多余部分显示...,点击全部展开
    • HTML/CSS 实现div居中、div内部元素垂直居中的简单示例
    • HTML,CSS,font-family:中文字体和英文名称对照表

四海网收集整理一些常用的php代码,JS代码,数据库mysql等技术文章。