设置border宽度:border-width(同上)属性,值为数值,还接受thin、medium和thick。注:值设置border-width,border并不可见,必须设置border-style非none值。
设置border颜色:border-color(同上)属性。注意点同上。
设置border属性的快捷方式:table {border: 2px solid black}
顺序自由。
(十二)WAP特有的CSS扩展
快捷键:-wap-accesskey ,用来指定XHTML MP元素的快捷键。
Input:定义文本框是否可以留空,什么类型,可以输入多少字符
Marquee:在屏幕上滚动一些内容。
(十二.1)WCSS快捷键扩展
给元素定义快捷键:-wap-accesskey属性
可用的属性值*,#,0,1,2,3,4,5,6,7,8,9
input.wcss_class {-wap-accesskey: 4}
直接定义*和#违反CSS2语法。需要使用Unicode转义字符\2a和\23。但是有些WAP浏览器(Sony Ericsson WAP 浏览器 )要求使用\2a 和 \23,一些(Openwave 手机浏览器) 要求使用* 和#。
与元素的accesskey属性同效,如同时定义,显示该属性值。
只用于四个元素a, input,label,textarea,其他定义也无效。
(十二.2)WCSS输入扩展
由两个属性组成:-wap-input-famat和-wap-input-required,对应于WML中<input>元素的format(定义类型和字符数量)和emptyok(是否可以留空)属性。
早些的移动设备上WAP浏览器不支持,但支持format和emptyok属性作为XHTML MP的扩展。为了更好的兼容性,建议WCSS和WML都使用。
<input type="text" format="N" style='-wap-input-format: "N"'/>
控制文本框的类型和字符数量:-wap-input-format。需应用在<input type=“text”>, <input type=“password”>和<textarea> 标签上,如应用在其他标签无效。格式字符(大小写敏感):a(小
写字母或符号),A(大写字母或符号),n(数字或符号)
(十二.2)WCSS输入扩展
N(数字),x(小写字母或数字或符号),X(大写字母或数字或符号),m(任何字符,默认小写字母输入模式,可换大写模式),M(任何字符,默认大写字母输入模式,可换小写模式)。属性值必须包含在引号内,由于部分Openwave 手机浏览器不支持单引号,建议使用双引号(<input type=“text” style=‘-wap-input-format: “N”’/> )
-wap-input-format: “2N” (最多两个数字) -wap-input-format: “NN” (两个数字) -wap-input-format: “*N” (无限个数字)
-wap-input-format: “A*a” (第一个大写字母或符号,0-n个小写字母或符号) -wap-input-format :“*M”(默认)
格式字符前使用数字或*的原则:1、只允许一次;2、在最后
(十二.2)WCSS输入扩展
如果值语法错误,则WAP浏览器忽略该属性。
也可以包含转义字符:’\’在WCSS中是特殊字符,使用’\\’。
控制文本框是否可以留空:-wap-input-required(值为:false和true ),帮助控制文本框是否可以空白。使用元素同上。
当-wap-input-format和-wap-input-required冲突时,以required优先。
(十二.3)WCSS Marquee扩展
可以在屏幕上滚动一些内容(一行文字,一个图片,一个链接等),但一些WAP浏览器只支持滚动文字。当内容超过屏幕时很有用。
包含四个属性和一个属性值:-wap-marquee属性值(display属性的值),-wap-marquee-dir属性(指定marquee的方向,值:ltr,rtl-默认),-wap-marquee-loop属性(指定marquee重复的时间,infinite永远,大多数默认为1),-wap-marquee-speed属性(指定marquee的速度,值:slow,normal-默认,fast),-wap-marquee-style(指定marquee在屏幕上如何滚动,有三个值:scroll-默认,slide,alternate)
(十二.3)WCSS Marquee扩展
二、WAP2.0设计原则
WAP2.0设计原则
设计站点前的准备工作
界面设计、挑选核心服务、WAP设备特性统计(浏览器等)
关注导航模型
一致易学的导航模型。简洁精确且快速的信息。尽可能减少输入(考虑选择列表、复选框或单选按钮等。-wap-input-format:*N;避免模式转换。首字母。 )
设计导航层次
导航模型一致、少用‘返回’链接、避免深度太深(4-5)、返回首页或目录
WAP2.0设计原则
考虑小尺寸屏幕的设计
确保内容可见、<title>少于14个字符、一致的样式、减少水平滚动、利用对齐属性增加可读性(1-3)、充分利用空间(图文)、避免过多使用文本样式属性、使用短小精确的词语、避免使用过多的颜色并保持一致、不用名字描述颜色。
保持较短的文档大小:内存有限,不支持WML的多card,使用锚链接等
不要包含长注释、去除缩进或空格、尽量少用id和class
6. 用户任务流流畅和图片合理使用
图片不是用户目的尽少使用、避免使用大表格。
WAP2.0设计原则
7. 页面上提供足够信息
首屏常用导航链接、搜索域、登录屏幕和大量信息;上下滚动困难,表单交互要简短。
为用户操作提供信息反馈
对用户操作、错误和问题情况提供正确的反馈。
9. 尽可能减少图片数量和减小图像容量大小
每张图片都是一个请求,降低页面显示的速度,且内容可能重排序,占用时间和资源,全站规划相同图片。
定义图像的高度和宽度属性
定义了预占位,改善用户体验,
WAP2.0设计原则
11. 谨慎使用表格
单元格宽度使用绝对宽度;嵌套层数增加,页面复杂度和处理时间增加;表格边框避免太粗。
12. 考虑添加样式定义选项
权衡!
使用Unicode字符编写XHTML MP内容
进行可用性测试
附录
1. 常用WAP模拟器
WinWAP、OpenWave、Opera
2. 常用WAP网站
www.wapforum.org
www.spforum.net
www.csdn.com
www.blueidea.com
www.cnwzz.net