Ⅰ css中的正则表达式
CSS中没有正则表达式。你那样的是CSS 2.0+
div[class^=ad(1|2|3|4)]
上面那样的写法是不合法的
只有写成div[class^="ad1"],div[class^="ad2"],div[class^="ad3"],div[class^="ad4"]
Ⅱ css表达式会造成页面重新渲染吗
css表达式不会造成页面重新渲染。
HTML的渲染原理:
Web页面运行在各种各样的浏览器当中,浏览器载入、渲染页面的速度直接影响着用户体验简单地说,页面渲染就是浏览器将html代码根据CSS定义的规则显示在浏览器窗口中的这个过程。先来大致了解一下浏览器都是怎么干活的:
1.
用户输入网址(假设是个html页面,并且是第一次访问),浏览器向服务器发出请求,服务器返回html文件;
2.
浏览器开始载入html代码,发现<head>标签内有一个<link>标签引用外部CSS文件;
3.
浏览器又发出CSS文件的请求,服务器返回这个CSS文件;
4.
浏览器继续载入html中<body>部分的代码,并且CSS文件已经拿到手了,可以开始渲染页面了;
5.
浏览器在代码中发现一个<img>标签引用了一张图片,向服务器发出请求。此时浏览器不会等到图片下载完,而是继续渲染后面的代码;
6.
服务器返回图片文件,由于图片占用了一定面积,影响了后面段落的排布,因此浏览器需要回过头来重新渲染这部分代码;
7.
浏览器发现了一个包含一行Javascript代码的<script>标签,赶快运行它;
8.
Javascript脚本执行了这条语句,它命令浏览器隐藏掉代码中的某个<div>
(style.display=”none”)。杯具啊,突然就少了这么一个元素,浏览器不得不重新渲染这部分代码;
css的渲染原理;
1、浏览器下载的顺序是从上到下,渲染的顺序也是从上到下,下载和渲染是同时进行的。
2、在渲染到页面的某一部分时,其上面的所有部分都已经下载完成(并不是说所有相关联的元素都已经下载完)。
3、如果遇到语义解释性的标签嵌入文件(JS脚本,CSS样式),那么此时IE的下载过程会启用单独连接进行下载。
4、并且在下载后进行解析,解析过程中,停止页面所有往下元素的下载。
5、样式表在下载完成后,将和以前下载的所有样式表一起进行解析,解析完成后,将对此前所有元素(含以前已经渲染的)重新进行渲染。
6、JS、CSS中如有重定义,后定义函数将覆盖前定义函数。
Ⅲ css expression求解
expression 可以将CSS和javascript表达式关联起来,这里的CSS属性可以是本身固有的,比如说你可以用body{width:expression(screen.availWidth+"px";}来设置页面宽度为屏幕可用宽度;也可以是自定义的属性,比如body{any:expression(onload=function(){xxx;xxx;xxx;},onunload=function(){xxx;xxx;xxx;xxx;);}为你定义了一种新的CSS属性any,该属性为BODY的onload和onunload定义了两个执行函数。
expression是css中的一个行为,IE5及其以后版本支持在CSS中使用expression,用来把CSS属性和Javascript表达式关联起来,这里的CSS属性可以是元素固有的属性,也可以是自定义属性。就是说CSS属性后面可以是一段Javascript表达式,CSS属性的值等于Javascript表达式计算的结果。 在表达式中可以直接引用元素自身的属性和方法,也可以使用其他浏览器对象。这个表达式就好像是在这个元素的一个成员函数中一样。
CSS Expression也称为CSS表达式,它是动态设置CSS属性的强大方法,但也存在着一定的危险性。
在CSS Expression中使用JavaScript表达式。CSS属性根据JavaScript表达式的计算结果来设置。
CSS Expression在其它浏览器中不起作用,因此在跨浏览器的编码中单独针对IE设置时会比较有用。
从IE5开始支持CSS Expression。我们看下面的代码:
background-color: expression((new Date()).getHours()%2 ? "#F00" : "#00F" );
上面的代码是使用CSS Expression,实现隔一个小时切换一次背景颜色。
CSS Expression的问题就在于它的计算频率要比想象的多出很多。不仅仅是在页面显示和缩放时,就是在页面滚动、乃至移动鼠标时都会要重新计算一次。给CSS Expression增加一个计数器可以跟踪表达式的计算频率。在页面中随便移动鼠标都可以轻松达到10000次以上的计算量。
一个减少CSS Expression计算次数的方法就是使用一次性的表达式,它在第一次运行时将结果赋给指定的样式属性,并用这个属性来代替CSS Expression。
如果样式属性必须在页面周期内动态地改变,使用事件句柄来代替CSS表达式是一个可行办法。如果必须使用CSS Expression,一定要记住它们要计算成千上万次并且可能会对你页面的性能产生影响。不要让您的用户感觉打开你的页面,机器会变的很慢。
Ⅳ CSS中expression怎么用
IE5及其以后版本支持在CSS中使用expression,用来把CSS属性和Javascript脚本关联起来,这里的CSS属性可以是元素固有的属性,也可以是自定义属性。就是说CSS属性后面可以是一段Javascript表达式,CSS属性的值等于Javascript表达式计算的结果。 在表达式中可以直接引用元素自身的属性和方法,也可以使用其他浏览器对象。这个表达式就好像是在这个元素的一个成员函数中一样。 是不是感觉上面的文字有点晦涩?没有关系,你只需要知道:我们可以通过expression把Javascript脚本写放在css文件中,通过它来实现一些很方便的功能与效果。
<style type="text/css">
#myDiv {
position: absolute;
width: 100px;
height: 100px;
background:#c00;
left: expression(document.body.offsetWidth - 180 "px");
top: expression(document.body.offsetHeight - -80 "px");
text-align:center;
line-height:90px;
color:#fff;
}
</style>
Ⅳ css3中,颜色的16进制的正则表达式该怎么写
/^#[\da-f]{3}([\da-f]{3})?$/i
可以匹配3位或6位的十六进制颜色值,并且不区分大小写
例如:#ccc,#000000,#FEFEFE等
Ⅵ CSS 中的 expression 表达式写法
恩,你要的50%如果是当前屏幕宽度的50%,可以先获取当前屏幕宽度再除以2,这样得到数值。
或者根据固定的屏幕宽度计算出50%的数字,用它来代替(document.documentElement.scrollLeft+50%)
Ⅶ 我想同时匹配以.css结尾,但是不以.min.css结尾的文件,正则表达式怎么写
写两个正则好容易些,如:
varreg1=/w*.css$/;
varreg2=/w*.min.css$/;
vart='aa.min.css';
if(reg1.test(t)&&!reg2.test(t)){
alert(t);
}
Ⅷ 为什么尽量避免使用 CSS 表达式
CSS 表达式可能会影响到网站的性能;
在更多的留意了关于 CSS 表达式方面的知识,而这篇文章,是我在看 《高性能网站建设指南》后,以及之前做的一些学习,我想总结下 “为什么尽量避免使用 CSS 表达式”;
什么是 CSS Expression?
CSS Expression (CSS 表达式),是一种使用动态设置 CSS 属性的方式,并且被 IE5 以上的版本所支持,但是 IE8 的标准模式已不再支持 CSS 表达式了[1];
一个简单的 CSS 表达式
body {
background-color: expression( (new Date()).getHours()%2 ? "#B8D4FF" : "#F08A00" );
}
这段代码的作用是能让你页面中 body 的背景色每隔一小时变换一次;
CSS Expression 带来的性能问题
是的,参考 MSDN “关于动态属性” 的文档,你会发现,其实 CSS 表达式还是非常强大的,比如你可以使用 CSS 表达式实现 min-width 属性,隔行换色,模拟 :hover, :before, :after 等伪类;
但是,正式因为 CSS 表达式太强大了,以至于 CSS 表达式带来的严重的性能问题:“为了确保有效性,CSS 表达式会进行频繁的求值”,到底有多频繁?就是在你改变窗口大小,滚动页面甚至移动鼠标都会触发表达式进行求值,如此频繁的求值以至于浏览器的性能收到严重的影响;
关于对 CSS Expression 的性能测试
这个测试的方法是来自于最近一段时间在看的《高性能网站建设指南》中的规则7;
P {
width: expression( setCntr(), document.body.clientWidth<600 ? "600px" : "auto" );
min-width: 600px;
border: 1px solid;
}
这个方法通过绑定一个 setCntr() 函数到 CSS 表达式上,统计页面执行了多少次的 CSS 表达式,并显示在一个文本框里面;你也可以通过 IE5 ~ IE6 访问http://stevesouders.com/hpws/expression-counter.php 进行测试;
测试结果
页面内有 10 个段落,加载完页面大概执行了 40 次的 CSS 表达式,然后在你改变页面大小,滚动页面,甚至移动鼠标,在我的测试里不动鼠标仍然会执行 CSS 表达式,几万次的求值根本不在话下,而且在点击文本框之后,IE 就已经卡死了;
避免使用 CSS Expression
好吧,这是一个总结;虽然还有对 CSS 表达式进行优化的方法(你可以在参考链接中找到),但是这不是这篇文章要总结的,这篇文章要总结的是为什么尽量避免使用 CSS 表达式;
CSS 表达式虽然强大,但是会给浏览器带来很严重的性能问题,并拖慢网页的加载速度;在可能的前提下,尽量避免使用 CSS 表达式!
Ⅸ CSS背景图片的正则表达式怎么写
比如url(images/nan_bg_o.jpg)这是背景图的css写法,它的正则表达式如下
VBScript codes=".x{background:url(images/nan_bg_o.jpg);}.xx{}.xxx{background: URL(images/nan_bg_oxx.jpg) ;}"
set rx=new RegExp
rx.IgnoreCase=true
rx.Global=true
rx.Pattern="url\s*\(([^\)]+)\)"
set mc=rx.Execute(s)
for each m in mc
response.Write "<pre>"&m.submatches(0)&"</pre>"
next
set rx=nothing