xhtml mp 和 wap css应用讲解一
使用wap css可以把内容和表示分离,好处:
1.使用wcss使内容和样式分离,可以为不同手机,设计几个版本wap css style sheet 和指定不同屏
幕大小。内容却不需要修改。
2.为不同设备,如PC,PDA,MOBILE PHONE,准备不同样式表,内容不需要改变。
3.减少维护一个wap站点,当有新的电话,只需要增加新的样式表,内容不需要修改。
4.多个wap页面应用一个wap css样式表,如果要改变页面,只需要修改样式表。
5.在多个工程中重复使用样式表。
6.如果应用样式表,这样mobile只是需要下载一次,然后就会存在缓存中,下次访问不需要在连接服
务器。
7.xhtml mp 文档变得更小,因为可以把布局和样式信息放入外部wap css样式表中。小文件下载时间
就更短。
缺点:
1.不同wap浏览器具有对wcss的不同支持度,一个wap浏览器支持,也许另一个就不支持。
2.一个外部wcss样式表,在第一次导入样式表时,会增加请求时间,如:
a. 样式表不再缓存中
b. xhtml mp和external wcss是两个不同的下载请求
c. 如果你用wcss指定mobile internet site的表示信息,wcss将变得相当大。
d. wap 浏览器需要额外的解析wcss
注意:
1.样式表使用,选择器区分大小写,即wcss和xhtml mp中保持一致!
eg: 页面中<h1>df</h1> ,样式表中,必须h1也是小写!
2.元素.样式名====此样式只能应用在此元素上。
.样式名====次样式可用于多个元素上。
3.使用class selector或者id selector是首选的,使用style attribute行内样式将引发混乱。
xhtml mp markup different:
1.div 与 span: span包括一个块元素,如文本;div 包括一个或多个块元素,如p,h1,table等元素。
重叠规则处理多组wcss 样式应用于同样元素:
1.如果在同一个文档,应用不同样式,在同一个元素上应用不同的样式,取最后导入的或应用的。
采用就近原则。
2.wcss的文本字体属性:
a. 加粗:<b></b>标签
b. 斜体:<i></i>标签
c. 字体变小:<smaller></smaller>
但是这样做使页面变得混乱,如果"<h1><b>呵呵</b></h1>"应用此,如要改变,则应用
此种样式的都要改变。
不同phone support different font
如果字体超过一个单词,要用引号
eg:
h3 {
font-family: "Times New Roman",Arial, Hel
相关文档:
<!---------<html>
<head>
<style type="text/css">
.tabheader table {
border-collapse: collapse; /* for IE */
border-spacing: 0; /* for N6 */
}
.tabheader table tr td {mar ......
abc.css
CSS code
.class1
{
width:10px;
background-color: red;
}
HTML code
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<link rel="stylesheet" type="text/css" href="abc.css" />
<TITLE> New Document </TITLE>
<script&g ......
css渐变代码4种
一、从上往下渐变
body{
FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#ffffff,endColorStr=#000000);
}
二、从左上至右下渐变
body{
FILTER: Alpha( style=1,opacity=25,finishOpacity=100,
startX=50,finishX= 100,startY=50,finishY=100);
background-col ......
CSS滤镜的使用方法:filter:filtername(parameters) 即 filter:滤镜名称(参数)
alpha:设置透明层次
blur:创建高速度移动效果,即模糊效果
chroma:制作专用颜色透明
DropShadow:创建对象的固定影子
FlipH:创建水平镜像图片
FlipV:创建垂直镜像图片
glow:加光辉在附近对象的边外
gray:把图片灰度化
inver ......
2009年2月24日
,Safari 4.0
beta版正式发布,Safari从它的3.2版本开始就已经支持所有的CSS选择器(包括最新的CSS3)。不过为了方便大家的工作,下面提供了最新版
本的CSS选择器浏览器支持情况,其中包括最新的CSS3和Safari 4.0 Beta的支持情况。感谢Estelle Weyl
的总结。
2009年6月30日
,FireFox 3.5发布,类似Safar ......