保藏本站 保藏本站
188bet注册网主页 - 软件测验 - 常用手册 - 站长东西 - 技能社区
主页 > CSS/HTML > 正文

主页 - PHP - 数据库 - 操作体系 - 游戏开发 - JS - Android - MySql - Redis - MongoDB - Win8 - Shell编程 - DOS指令 - jQuery - CSS款式 - Python - Perl

Access - Oracle - DB2 - SQLServer - MsSql2008 - MsSql2005 - Sqlite - PostgreSQL - node.js - extjs - JavaScript vbs - Powershell - Ruby

《CSS3实战》笔记--突变规划(三)

IE浏览器引擎的CSS突变完成办法

IE并不支撑CSS突变,可是供给了突变滤镜,可以用来完成简略的突变作用。

根本语法

该参数的参数阐明如下:

enabled:设置或检索滤镜是否激活。可选布尔值,包含 true 和 false,默许值为 true ,表明激活状态。

startColor :设置或检索色彩突变的开端色彩和通明度。可选项,其格局为#AARRGGBB。AA,RR,GG,BB为十六进制正整数,取值规模为00~FF。RR指定赤色值,GG指定绿色值,BB指定蓝色值,AA指定通明度,00是彻底通明,FF是彻底不通明。超出取值规模的值将被康复为默许值。取值规模为#FF0000~#FFFFFF,默许值为#FF0000FF,即不通明蓝色。

EndColorStr : 设置或检索色彩突变的完毕色彩和通明度。默许值为#FF000000,即不通明黑色。

IE 突变滤镜实战运用

运用IE滤镜规划突变布景,然后经过布景图画规划图文插画作用。

代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>IE浏览器引擎的CSS突变完成办法</title>
<style type="text/css">
body {
 padding:1em;/让突变布景填充整个页面/
 margin:0;
 text-align:center;
 /*为网页规划笔直突变布景*/
 filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0, startColorStr=#9999FF, endColorStr=#ffffff);
}
h1 {/*标题款式*/
 color:white;
 font-size:18px;
 height:45px;
 line-height:65px;/*操控文本显现方位*/
 /*以绝地定位办法完成块元素居中显现*/
 position:absolute;
 left:50%;
 margin-left:-150px;
 padding-left:50px;
 border-bottom:solid 2px #c72223;
 /*为标题刺进一个装修图标*/
 background:url(images/icon4.png) no-repeat left center;
}
ul {/*列表框款式*/
 /*铲除列表默许款式*/
 list-style-type:none;
 margin:90px 0 0 0;
 padding:0;
 background:url(images/bg6.png) no-repeat right bottom;/*规划插图布景*/
 clear:both;
 text-align:left;/*康复默许对齐办法*/
}
li {
 line-height:1.5em;
 margin:6px auto;
 /*为列表项规划个性化的列表图标*/
 font-size:14px;
 background:url(images/icon3.png) no-repeat left 3px;
 padding-left:20px;
}
</style>
</head>

<body>
<h1>喜爱是一种心境,爱是一种感触</h1>
<ul>
 <li>有一种爱叫痴缠,比方许多人对张国荣的,有时分这样真的挺好,没有比爱一个故人更安全和永久的了。</li>
 <li>有一种爱叫沉迷,某一时间里,遽然发现自己迷上某个人或某种感觉,但那不会持久。有时分沉迷会转化成爱。</li>
 <li>爱里边一定有沉迷、有喜爱。可沉迷、喜爱都不是爱。</li>
 <li>当自己总算了解什么是爱的时分,往往生命去了多半。人生路上能遇上一个真实爱自己的人,是机缘。</li>
 <li>有时分,爱是一会儿的感觉,爱并不能持久保存,假如两人运营得好才会持久保存下去。爱一起是软弱的,爱会破碎。</li>
 <li>有时分,爱是一种愿望,一种可以让自己与对方更高兴的心境。一份夸姣的爱必定离不开容纳。</li>
 <li>有时分,爱是一种天然。花开花落,云卷云舒的一点没有强求。</li>
 <li>当可以以一种平平的心境看待爱情时,爱便变得隽永。</li>
 <li>爱情有时分让人变得很严苛,但后来又会很容纳。当爱对方超越爱自己,那爱就会很容纳。</li>
 <li>喜爱一个人不会对他很严苛,因为喜爱不会有更多的要求。相反爱却是严苛的。</li>
 <li>喜爱一个人不会为她很心痛,爱却往往是很心痛。爱是一种归属,喜爱没有归属。</li>
 <li>在喜爱与爱的边际徜徉的人,假如尝试着脱离很远,还能在某个深夜静静地想起他,想到心痛与流泪,那一定是爱了。</li>
 <li>在爱上之前可能有很长的喜爱,有时喜爱就能转化成爱,有时喜爱也会淡掉。原来人与人都是平行线上的一些点,檫肩而过很往常,向左转,向右转,下一个路口,还会有新的景色。</li>
 <li>有时分喜爱会带来惋惜,但爱情会带来损伤。这种损伤最终会变成对对方终身的祝愿。但喜爱就会越来越淡,最终在心里留下一个冷漠的影子。爱比喜爱要有力气。</li>
</ul>
</body>
</html>

演示作用:

检查图片

W3C规范化的CSS突变完成办法

25个突变布景网页规划事例赏识

规范草案沿用Gecko引擎的突变规划办法:http://dev.w3.org/csswg/css3-images/#gradients

CSS3完成动态翻牌作用 仿百度贴吧3D翻牌一次动画特效
今日共享一个CSS3制造的翻牌作用,作用如下图所示,所过把把这个作用运用于相册肯定会很炫的。呵呵,超酷啊。一、HTML代码:因为是CSS3完成,所以

html5手机触屏touch事情介绍
HTML5中新添加了许多事情,可是因为他们的兼容问题不是很抱负,运用实战性不是太强,所以在这儿根本省掉,我们只共享运用广泛兼容不错的事情,日

HTML5实战与剖析之接触事情(touchstart、touchmove和touchend)
HTML5中新添加了许多事情,可是因为他们的兼容问题不是很抱负,运用实战性不是太强,所以在这儿根本省掉,我们只共享运用广泛兼容不错的事情,日

本周排行

更新排行

强悍的草根IT技能社区,这儿应该有您想要的! 友情链接:b2b电子商务
Copyright © 2010 touzhuwang75.com. All Rights Rreserved  京ICP备05050695号