- 浏览: 78022 次
- 性别:
- 来自: 南京
最新评论
-
yingzhixing:
这种方式 如果多点几次后退的话,就不好用了。。。
禁止页面后退,禁止回退,js禁止回退,禁止页面回退 -
chenzheng8975:
wml语言好像已经过时了啊。。。。
Wap模拟器,pc端浏览器,手机wap网站,web项目 -
808_小星星:
白菜路过,表示………………
jsp页面的onclick事件
XHTML Mobile Profile 的基本结构
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN"
"http://www.wapforum.org/DTD/xhtml-mobile10.dtd" >
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="application/vnd.wap.xhtml+xml;charset= UTF-8"/>
<title>中文页</title>
<link rel="stylesheet" href="style.css" type="text/css"/>
</head>
<body>
<h1> 标题 </h1>
文本
</body>
</html>
---------------------------------------------------
定义样式表
XHTML 移动规范[XHTMLMP]规定,外部样式表是可选的,并可通过下面两种方法之一为 XHTML文档定义
外部样式表:
通过一个在XML 声明(<?xml>)后而不是在<head>元素中定义的 XML处理指令,如下所示。注意,建议定义新的“handheld”媒体类型:
<?xml-stylesheet href="mystylesheet.css" media="handheld" type="text/css" ?>
通过在<head>元素中定义的一个或多个<link>元素,例如:
<link href=”mystyle.css” type=”text/css” rel=”stylesheet”/>
还可以通过在嵌套于<head>元素中的<style>元素里定义样式属性来创建一个内部样式表。用这种方法定义的样式可以应用于整个文档。
注意,除了样式表,还可以利用属性 style 把样式应用于个别元素。其优先级顺序为:
1. 首先应用浏览器的默认样式。
2. 外部样式表覆盖默认样式。
3. 文档头元素中的 style 元素覆盖外部样式表。
4. 位于一个标签中的行内样式覆盖之前只对该标签定义的所有样式。
---------------------------------------------------
<meta>元素是 XHTML MP的一部分,但很多浏览器不支持meta 功能。在XHTML MP中不支持属性http-equiv。
在 XHTML MP中,<body> 元素不支持bgcolor、text、link属性。与其它 XHTML MP 元素一样,<body>支持class、id、style属性来指定 CSS特性
XHTML MP 中的所有文本 必须包含一个元素或一个其它XHTML MP元素(如头、列表、表等)。
------------------------------------------------
列表
<h2>Definition lists 定义列表</h2>
<dl>
<dt>Atom</dt>
<dd>Subject consists of atoms</dd>
<dt>Proton</dt>
<dd>Constituent of the atom</dd>
</dl>
<h2>Numbered lists 有序列表</h2>
<h2>Unnumbered lists 无序列表</h2>
---------------------------------------------------
XHTML Basic 和XHTML MP之间的格式化差异
下面的XHTML 元素不是 XHTML Basic的组成部分, 但被加入到了 XHTML MP中;
注意,除了 hr中的 align="left|right|center",在这些元素中不支持任何属性。
属于XHTML MP 但不属于 XHTML Basic的元素
<b> <big> <i> <small> <hr/>
---------------------------------------------------
对 XHTML MP的格式化限制
在 XHTML MP中,元素<br/>不支持属性clear*。
元素<div>、<h1> 至<h6>以及不支持属性align。
XHTML MP 不支持元素<blink>* 。
如下所示,使用WAP CSS的样式特性显示闪烁文本
<span style="text-decoration: blink">this blinks</span>
或者使用更好的方法:
<span class="blink">
这里,用<style>元素或外部样式表定义下面的类:
.blink { text-decoration:blink }
-----------------------------------------------------
锚(anchor)元素
在 XHTML MP中, 元素<a> 支持除coords、 button、 name、 shape 和target 外的所有 HTML属性。
诺基亚移动浏览器支持 name 属性以保持与 CHTML 的兼容性。
类似于WML 卡片的分段锚
XHTML MP 支持对“ 段”锚的链接。在 Web 中可以见到这种情况,点击一个链接时,页面就向下滚动至当前页面的某个部分,也可是“回到顶部”的链接:
Help
...
<a name="h">Help text</a>
第 接显示文本Help。该链接被选中时,显示包含名为h的锚的文档部分。只有属性 name(没有属性href)的锚没有下划线并且无法被选中 们是具有属性 href="#anchor-name"的锚的不可见目标。
这是一种产生类似于WML“多卡片”行为的合理方法 XHTML页面的上端有一个 “ ” 链接,可以利用“ 跳至该页面的各个部分。例如,在页面底部可能有帮助文本,用户可以利用Help 链接迅速滚动到底部获取帮助文本。后退(Back)键能使用户返回到滚动前的位置,就如在Web浏览器中一样。
下面的程序段示例了一个锚元素,在此元素中对快捷键5 进行了定义,并将其链接到同一文档中的某个分段。
Help
------------------------------------------------------
发起电话呼叫
为在用户电话上创建一个能产生语音呼叫的锚:
调用 WMLScript 库函数wtai://wp/mc;NNN ,其中NNN 表示由数字组成的被呼电话号码。
Call 800 Info
该锚的显示与普通锚相同。当用户选中链接时,就会给出让用户确认呼叫号码的提示,然后将会拨通呼叫。
许多XHTML MP 浏览器还支持 i-mode tel: scheme,它是一个扩展,可以发起电话呼叫。可选属性cti="…"(如果存在的话)能够拨通号码,然后发送带有停顿(,)的 DTMF“ 音多频拨号音”,并且等待用户的确认(/)。<a>标签中的属性 href="tel:…"、 telbook="…"或 email="…"的任意组合都能启动移动设备的“ 电话簿”功能,并同时给出预设的可用数据。
Call John
执行上面语句将会拨出号码 8005551234,然后等待并提示用户按下 OK键以发送 DTMF 音频123。另外,还会启动“ 电话簿”选项功能,此选项功能在电话簿中把 tel: value(或 cti 的值,如果给出该值的话)保存到姓名 John Doe下,如果设备在电话簿中支持 e-mail 地址,它还将保存 e-mail 地址。
-------------------------------------------------------
保存到电话簿
为创建一个能在用户电话簿上保存姓名和号码的锚:
调用 WMLScript 库函数wtai://wp/ap;NNN;aaa ,其中 NNN 表示由数字组成的被呼电话号码,aaa表示由字母和数字组成的姓名。
[url=wtai://wp/ap;8005551234;John Doe]Save John Doe[/url]
-------------------------------------------------------
发送e-mail
许多支持发送 e-mail(如短消息服务[SMS],多媒体消息服务[MMS]或其它格式)的设备支持mailto: 方案 一个可以发送 e-mail消息的扩展:
Message to John
还可以在 URL中指定默认的 subject 和/或body以获得参数:
Message to John
--------------------------------------------------------
快捷键
设备显示屏上的链接使导航变得快捷,它们甚至是导航不可缺少的部分,尤其在文档较长时,使用链接可以跳至文档的某个部分。然而,即使使用链接,也需要把页面滚动到链接位置,因此为到达链接位置用户需要多次按键操作。
快捷键使用户通过一次按键就能激活可见的链接,而无需到达链接位置。在<a>元素中加入属性accesskey就能创建快捷方式。该属性值定义为了激活链接用户必须按下的键。
然而,为让用户知道应该按下哪个键,有必要用文本 在<a>元素之前的<p>元素中)说明为属性accesskey选择的按键号码。在文本中加入按键值可保证用户看到与描述锚目标的文本 起的快捷键值。例如,在内容中定义下行:
1 Next
导致如下显示:
1 Next
范例:
<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN"
"http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html mlns="http://www.w3.org/1999/xhtml">
<head>
<title>XHTML 1</title>
</head>
<body>
<a name="top"/>
<h2>Anchors</h2>
<p>
Bottom<br/>
1 File<br/>
2 Call Directory<br/>
3 <a href="mailto:joe@company.com?
subject=The%20Subject&
body=this%20is%20the%20message" accesskey="3">
Email Joe</a><br/>
Top<br/>
<a name="bottom"/>
</body>
</html>
--------------------------------------------------
菜单中的快捷键(Access-key)选项
在诺基亚移动浏览器和诺基亚 Series 40移动设备中,所有包含属性 accesskey的链接和提交按钮都被自动加入选项菜单中。选项菜单中的标签是元素<a>的文本 (如果元素<a>只包含一个图像,则是 img的属性alt 的值)或提交按钮的值。为匹配菜单,必要时需对文本 短。
这个功能确保用户总能快速获得主导航链接,不管滚动到了当前页面的何处。这与 WML 1.x 中的元素<do>功能相同(并且比<do>简单)。
包含属性 accesskey的锚和提交按钮都以它们在文档中出现的顺序被加入选项菜单中。
-------------------------------------------------
Forms
与 WML 不同,XHTML Form是利用提交按钮发送给服务器的,而 WML利用具有元素 postfield的锚。
可以利用 Form 中的CSS来提供具有 padding 和margin 属性的元素定位功能。此外,还支持 CSS 边界,但在诺基亚浏览器中,CSS边界出现在元素input、textarea和 select 中已经存在的黑色边界之外。
XHTML MP支持的窗体元素:
select textarea Optgroup option form Input label
XHTML MP 不支持下列各项:
<form>元素的属性accept-charset
任何元素的属性 tabindex 和 label
元素<fieldset>、<button>和<legend>
<input>元素中的type="button"
-------------------------------------------------
form 元素
Form 元素定义 action 和 method,二者都是用来向 Web 服务器发送Form 数据的。action 定义Form数据送往的服务器上的 URL。method 可以是get 或 post。
可以使用 method="get"发送 Form 数据作为附加在URL 之后的查询字符串值。例如:
<form method="get" action="form-process.cgi">
Name: <input type="text" name="uname"/><br/>
Password: <input type="password" name="pw"/>
</form>
将会请求使用如下URL的页面:
http://form-process.cgi?uname=Joe&pw=xyzzy
--------------------------------------------------
input 元素
input 元素用于输入短小文本 一行)或密码。用户通常利用input 元素输入用户名、密码、e-mail 主题、电话号码等。
XHTML MP 中支持的输入元素类型
Text Password Checkbox Submit Radio Reset Image Hidden
XHTML MP中不支持的HTML输入属性
Accept Align alt Disabled Ismap Readonly Usemap
范例:
<form action="form-process.xhtml" method="get">
First Name:
<input type="text" name="fname" title="First Name"
style="-wap-input-format:ammmmmm"/> <br/>
<input type="submit"/>
</form>
---------------------------------------------------
复选框
<input type="checkbox" name="..."/>
使用属性 checked="checked"定义默认情况下被选中的复选框。考虑服务的目标群体,判定哪个选项是大多数用户的可能选择,然后适当地把选项设定为选中或未选中。(注意,在 XHTML中,每个属性都必须有一个引用值,而HTML中布尔型属性可以省略这个值。)
---------------------------------------------------
单选按钮
<input type="radio" name="..."/>
在同一个 form 中,确保给每个单选按钮定义的name属性相同。
---------------------------------------------------
提交(Submit)或复位(Reset)按纽
<input type="submit"/>
<input type="reset"/>
---------------------------------------------------
文本 (textarea)元素
避免定义比内容区域还要大的文本 ,即使要求的输入长度超过文本区的大小。
---------------------------------------------------
选择(select)元素
如有可能,定义一个默认的选项(selected="selected")。
在一个单选列表(即不包含 multiple="multiple")中,如果选项元素都没有定义selected="selected",则选择列表的第一个选项将最先被选中。
在有语句 multiple="multiple"的选择列表(多选列表)中,如果选项元素都不包含selected="selected",则选择列表最初为空。
范例:
<form action="form-process.xhtml" method="get">
Choose City:<br/>
<select name="city">
<option value="Boston">Boston</option>
<option value="Dallas">Dallas</option>
<option value="SanFrancisco">San Francisco</option>
</select>
<br/>
<input type="submit" value="Continue"/>
</form>
---------------------------------------------------
隐藏字段
<input type="hidden"/>
如果你发现自己正在创建多个隐藏值,那么就可能在XHTML 页面中保存了太多“状态”,这使页面大小和Form请求大小比必需的大。可以使用大多数Web 服务器中可用的“session”功能,来将用户状态存储到服务器上的会话数据库中。
在 XHTML窗体中,可以使用单个隐藏字段来保存session ID,此ID将与各窗体请求一起发送。而一些 Web 服务器 session 工具使用cookie 保存当前的session ID。cookie值可以与每个页面请求一起发送,这增大了所有请求的大小,而隐藏值仅在提交 Form 时发送。
---------------------------------------------------
表格
与 WML 相比,具有WAP CSS的 XHTML MP使表格具有更好的布局。例如,在WML 中,不能修改和去除表格边界,但在具有WAP CSS 的XHTML中是可能的。
加入列标题(<th>)和表格标题(<caption>)是一个好主意。避免定义大于显示屏高度的表格单元。
XHTML MP 中不支持的表格属性
Align Cellpadding Cellspacing Border
与 XHTML MP一起使用的WAP CSS特性允许设计单元填充、页边空白、文本对齐和边界的样式,对左/右/上/下边界的控制是分开的。WAP CSS 还控制边界宽度以及色彩(在支持色彩的设备中)。
在 XHTML MP中,元素<td>和 <th>不支持属性width 或 height。
---------------------------------------------------
图像
在图像周围加入白色象素制造空白空间,这样可防止其它图像或周围的文本 粘”在图像边界上。这可以通过 WAP CSS 的属性margin实现。
在标记中显式地定义图像的高度和宽度,这样可使浏览器为图像预留合适的空间。
例如: [img]pics/header_main_page_001.gif" width="175" height="41[/img].
使用WAP CSS的属性float:left 或 float:right 使文本 于小于显示屏宽度一半的图像周围。与从新的一行开始的文本 悬浮文本 终端用户进行的滚动较少。
在<img>元素中利用属性alt 定义替换文本 果无法载入图像,多数浏览器将显示该文本。
在 XHTML MP中,<img>元素不支持属性 align、border、 hspace、vspace 和 usemap。
---------------------------------------------------
关于XHTML 的其它知识
软键
在诺基亚电话中,软键是固定的,并且不能被覆盖。左侧软键的标签为 Options(在输入文本 为 OK ),右侧软键的标签为 Back(在输入文本时为 Clear)。
在浏览过程中,Options软键使得用户在任何时候都能轻松访问所有浏览器相关选项。Back 软键使用户返回到先前访问的 XHTML 页面。
在诺基亚移动浏览器中,包含属性accesskey 的所有链接和提交按钮都被自动加入到选项菜单中。
脚本
在 XHTML MP中,不支持<script>元素和任何元素的script 属性。XHTML MP 包含元素<object> 和 <param>,但一些移动浏览器可能不支持它们。
Cookies
诺基亚移动浏览器的4.0 版本 过Nokia Activ Server网关以及其它网关支持标准的 HTTP cookie。
框架
在 XHTML MP中不支持框架。
扩展
诺基亚移动浏览器和许多其它 XHTML MP浏览器支持对 XHTML MP的扩展以保持与 CHTML的兼容性:
<blink> <marquee> <u> <dir> <menu>
tel: URI scheme, with cti, telbook, and email attributes
XHTML MP 和 WML 1.3 间的差别包括:
● 在 WML 1.3 中不使用XML 命名空间,但在 XHTML中使用。默认的命名空间是 XHTML。
● 在 XHTML MP中,去除了WML 的根元素<wml>。作为替代,一直把XHTML 的元素<html>用作根元素。
● 在 XHTML模块中,使用以下各项:XHTML Basic 中的所有元素、元素<hr>、行内属性<style>以及元素<b>、<big>、<I>和<small>。
● 在 XHTML MP中,元素<head>是必须的。在 WML 1.3 中,该元素是可选的。
● 在 XHTML MP中, WML 的元素<template>已经去除。
● 在 XHTML MP中, WML 的元素<card>已经去除,并用<body>代替。与 WML 1.x 中的<card>不同,一个文件中只能有一个<body>元素。
● 在 XHTML MP中去掉了 WML的属性ordered。
● 在 XHTML MP中不支持 WML事件,如:<do>、<ontimer>、<onenterforward>、<onenterbackward>、<onevent>、 <onpick>、<go>、<prev>、<noop>和<postfield>。
● 在 XHTML MP中不能使用WML 的元素<do>。
● 行内表格(即段落中的 WML 元素<table>)是合法的,但在标准 XHTML 中是非法的。但是,为支持从WML 1.3到 WML 2.0 的转换,在 XHTML MP 中允许使用行内表格,诺基亚移动浏览器也对此给予支持。
● 元素<pre>可以包含窗体控制元素<input>和<select>。这在XHTML中是非法的。但是,为实现从 WML 1.3到 XHTML MP的转换,XHTML MP 允许在<pre>中使用窗体元素,诺基亚移动浏览器也对此给予支持。
● 输入元素不支持 WML 的属性 format (用于控制被认可的输入字母),并用CSS 的新属性-wap-input-formal作为替代,该属性与WML 的属性format 具有相同的语法。具体写法:style="-wap-input-format:ammmmmm"
● XHTML MP 在元素<a>、<input>、<label>和<textarea>中支持属性 accesskey 。但要注意,可能所有设备都不支持accesskey。
● XHTML MP 中不支持WML 的格式化元素 <u>*。
在XHTML MP中实现格式化的推荐方法是使用 CSS类, 这可以通过在外部样式表中定义如下样式来完成:
.u {text-decoration:underline}
然后利用与类在一起的 span 元素来设置样式;
例如:
<span class="u">This is underlined</span>
● 在 XHTML MP中不支持其它 WML 1.x 元素。WAP 论坛定义了一个对 XHTML MP的扩展,该扩展被称为WML 2.0。WML 2.0 包含WML 1.x 的“兼容性”元素(如<wml:card>、 <wml:do>等)以实现WAP 网关从 WML1.x 到 WML 2.0 的自动翻译 。由于诺基亚移动浏览器原本 持 WML1.x ,翻译是不必要的,所以诺基亚移动浏览器不支持WML 2.0 。
------------------------------------------------
WAP CSS
1 引入外部文件
<link rel="stylesheet" href="mydoc.css" type="text/css"/>
2 文档头中的样式元素
<style> p {color: blue} </style>
3 使用XHTML的 style属性
<p style="color:red”>red
4 使用XHTML的 class属性
.class1 {padding-bottom:4px}
This paragraph will have bottom padding.
5 使用XHTML的 id属性
<style>
#myid {border-width: 1; border: solid; text-align: center}
<style>
<h1 id=”myid” >This heading has a solid border.</h1>
6 使用XHTML 的元素div 和 span
以上讨论了把由一个或多个元素定义的样式应用于内容,除此之外,还可以利用div 元素把样式(在样式表或<head>元素中被定义)应用于一系列元素或利用span元素把样式应用于一系列行内字符。
<div class=”test-case”>
This paragraph is blue.
Here are <span class=”test-id”>Test51 and Test52</span> specs.
</div>
-----------------------------------------
应避免的事项
● 避免使XHTML内容不能进行自动换行。也就是说,不要在属性white-space中使用值nowrap。
● 避免去掉锚(<a>元素)的下划线。也就是说,不要在锚中使用样式 text-decoration:none。
● 避免在普通文本 属性 text-decoration:underline。
● 避免过多地用属性font-style 和 font-variant 来强调文本 尤其在同一XHTML页面中。
● 避免在同一XHTML 页面中使用过多不同的字体类型(属性font-family)和字体大小(属性font-weigh 和font-size)。在一个XHTML 页面中,尽量把字体大小和字体类型限制在1 至3种。
WAP2.0 文档结构
必须包含<html>, <head>, <title>和<body> 元素。
<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Hello world</title>
</head>
<body>
Hello world. Welcome to taobao.com.
</body>
</html>
注意:
XML声明和字符编码:<?xml version="1.0" encoding="UTF-8"?>
UTF-8/16编码可省略。XML声明也不是必须的,但如果忽略在许多WAP浏览器中出错。
必须有DOCTYPE声明。在XML声明和<html>元素之间。
<html>、<head>、<title>、<body>必须要有
元素,align属性已经去除,可以通过WAP CSS的text-align属性来设置
WAP2.0与WAP1.0区别
WAP1.0基于WML语言开发,支持WMLScript
WAP2.0基于XHTML MP开发,支持WCSS
WAP1.0只能通过手机或特殊浏览器浏览。
WAP2.0开发的站点可以在WEB和无线上都可以使用,也可以用任何Web浏览器访问WAP2.0应用。
WAP2.0所不支持WAP1.0的特性
1.
XHTML MP 不支持<deck>和<card>标签
在XML中,一个文件可以包含一个或更多的card,所有的card组合成一个deck,并在无线设备中一同被下载。WAP浏览器每次只显示一
个card,可以通过锚链接访问其他的card。通过这些,减少了服务器的往返的访问。对性能的提高是有意义的。在XHTML MP中要实现类
似的特性,可以使用multipart messages(多个文档放到一个请求)另外一个方式是使用目标锚(一个页面的不同位置)。
2.XHTML MP 不支持<timer>标签
可使用<meta>代替定时器
<head> <meta http-equiv="refresh" content="10;URL=http://www.planabc.net/" /></head>
<meta>元素10秒后告诉WAP浏览器URL。
注意点:WML timer 仅当进入card,而HTML refresh timer当进入XHTML MP页面。
3.XHTML MP 不支持事件
WML支持四个事件(ontimer,onenterbackward,onenterforward,onpick),除ontimer其他事件无法模拟。如要使用,需使用WML1.X
4.XHTML MP 不支持变量
在XML,可以声明变量,并赋值,拥有全局作用域。可以在任何的deck和card中使用。XHML MP放在服务器端处理(必须发送并保存)。
5.XHTML MP 不支持客户端脚本
在XML,你可以使用客户端脚本(WMLScript)。JavaScript的简化版,常用来验证数据。放在服务器短处理。将来的版本将会支持客户
端脚本(ECMAScript MP),支持所有的WMLScript功能
6.XHTML MP 不支持可编程序软键(Programmable SoftKeys)
WML的一个最大特征。通过<do>标签使用。
在XHML MP中可以使用 accesskey 属性。锚链接和提交按钮支持这个属性:
<a accesskey="1" href="part1.xhtml">XHTML MP Tutorial Part 1</a>
WCSS中的-wap-accesskey属性也可以用来定义:a.wcss_class_1 {-wap-accesskey: 1}
7.
XHTML MP 不支持<u>标签
在XML,<u>用来在一些文字下添加下划线。可以用WCSS中的text-decoration属性。
8.
XHTML MP 不支持Input框的format属性
在XML,可以定义类型和字数限制。可以使用WCSS中的-wap-input-format属性,语法一致。
比如限制5个数字字符:input {-wap-input-format:"5N"}
9.
XHTML MP 不支持锚链接传输数据
WAP1.0 提交数据
<p> 姓名:
<input name="name"/><br/>
<anchor>
<go method="get" href="yuanxin.php">
<postfield name="name" value="$(name)"/>
</go>
提交
</anchor>
WAP2.0 提交数据
<form action="yuanxin.php" method="get">
姓名:
<input name="name"/><br/>
<input type="submit" value="提交"/>
</form>
WAP2.0 开发语言 XHTML 和 HTML的区别
1.
XHTML文件的开始要声明DTD
XHTML 1.0 Transitional//EN" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd
2.所有的标签都必须被关闭,空标签也不例外
HTML中的<br>要写成<br/>注意,后面加了一个空格" "和一个反斜杠"/"
3.所有的标签和标签的属性都必须小写,属性值可以大写
如错误代码:
<BODY>
<P>This is a paragraph</P>
</BODY>
正确格式为:
<body>
This is a paragraph
</body>
4.属性值必须用引号括起来。单引号双引号均可
错误的代码:
<table width=100%>
正确的代码:
<table width="100%">
5.XHTML 元素一定要被正确的嵌套使用
在HTML里一些元素可以不正确嵌套也能正常显示,如:
<b><i>This text is bold and italic</b></i>
而在XHTML必须要正确嵌套之后才能正常使用,如:
<b><i>This text is bold and italic</i></b>
6.如果你使用的是strict.dtd。也就是最严格的XHTML,那么许多定义外观的属性都将不被允许
例如你为图片添加链接的同时想去掉边框。不可以再使用<img src="..."border="0">,而是必须通过CSS来实现。
属性的缩写被禁止
错误的代码:
<dl compact>
<input checked>
<input readonly>
<input disabled>
<option selected>
<frame noresize>
正确的代码:
<dl compact="compact">
<input checked="checked" />
<input readonly="readonly" />
<input disabled="disabled" />
<option selected="selected" />
<frame noresize="noresize" />
HTML中可缩写的属性列表:
HTML XHTML
compact compact="compact"
checked checked="checked"
declare declare="declare"
readonly readonly="readonly"
disabled disabled="disabled"
selected selected="selected"
defer defer="defer"
ismap ismap="ismap"
nohref nohref="nohref"
noshade noshade="noshade"
nowrap nowrap="nowrap"
multiple multiple="multiple"
noresize noresize="noresize"
7.用id属性代替name属性
HTML 4.01 中为a,applet, frame, iframe, img 和 map定义了一个name属性.在 XHTML 里name属性是不能被使用的,应该用id 来替换它。如:
错误代码:
[img]picture.gif" name="picture1[/img]
正确的代码:
[img]picture.gif" id="picture1[/img]
注意:我们为了使旧浏览器也能正常的执行该内容我们也可以在标签中同时使用id和name属性。如:
[img]picture.gif" id="picture1" name="picture1[/img]
为了适应新的浏览器浏览加了/来结束标签。
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN"
"http://www.wapforum.org/DTD/xhtml-mobile10.dtd" >
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="application/vnd.wap.xhtml+xml;charset= UTF-8"/>
<title>中文页</title>
<link rel="stylesheet" href="style.css" type="text/css"/>
</head>
<body>
<h1> 标题 </h1>
文本
</body>
</html>
---------------------------------------------------
定义样式表
XHTML 移动规范[XHTMLMP]规定,外部样式表是可选的,并可通过下面两种方法之一为 XHTML文档定义
外部样式表:
通过一个在XML 声明(<?xml>)后而不是在<head>元素中定义的 XML处理指令,如下所示。注意,建议定义新的“handheld”媒体类型:
<?xml-stylesheet href="mystylesheet.css" media="handheld" type="text/css" ?>
通过在<head>元素中定义的一个或多个<link>元素,例如:
<link href=”mystyle.css” type=”text/css” rel=”stylesheet”/>
还可以通过在嵌套于<head>元素中的<style>元素里定义样式属性来创建一个内部样式表。用这种方法定义的样式可以应用于整个文档。
注意,除了样式表,还可以利用属性 style 把样式应用于个别元素。其优先级顺序为:
1. 首先应用浏览器的默认样式。
2. 外部样式表覆盖默认样式。
3. 文档头元素中的 style 元素覆盖外部样式表。
4. 位于一个标签中的行内样式覆盖之前只对该标签定义的所有样式。
---------------------------------------------------
<meta>元素是 XHTML MP的一部分,但很多浏览器不支持meta 功能。在XHTML MP中不支持属性http-equiv。
在 XHTML MP中,<body> 元素不支持bgcolor、text、link属性。与其它 XHTML MP 元素一样,<body>支持class、id、style属性来指定 CSS特性
XHTML MP 中的所有文本 必须包含一个元素或一个其它XHTML MP元素(如头、列表、表等)。
------------------------------------------------
列表
<h2>Definition lists 定义列表</h2>
<dl>
<dt>Atom</dt>
<dd>Subject consists of atoms</dd>
<dt>Proton</dt>
<dd>Constituent of the atom</dd>
</dl>
<h2>Numbered lists 有序列表</h2>
- The first
- The second
<h2>Unnumbered lists 无序列表</h2>
- Meat
- Veggies
---------------------------------------------------
XHTML Basic 和XHTML MP之间的格式化差异
下面的XHTML 元素不是 XHTML Basic的组成部分, 但被加入到了 XHTML MP中;
注意,除了 hr中的 align="left|right|center",在这些元素中不支持任何属性。
属于XHTML MP 但不属于 XHTML Basic的元素
<b> <big> <i> <small> <hr/>
---------------------------------------------------
对 XHTML MP的格式化限制
在 XHTML MP中,元素<br/>不支持属性clear*。
元素<div>、<h1> 至<h6>以及不支持属性align。
XHTML MP 不支持元素<blink>* 。
如下所示,使用WAP CSS的样式特性显示闪烁文本
<span style="text-decoration: blink">this blinks</span>
或者使用更好的方法:
<span class="blink">
这里,用<style>元素或外部样式表定义下面的类:
.blink { text-decoration:blink }
-----------------------------------------------------
锚(anchor)元素
在 XHTML MP中, 元素<a> 支持除coords、 button、 name、 shape 和target 外的所有 HTML属性。
诺基亚移动浏览器支持 name 属性以保持与 CHTML 的兼容性。
类似于WML 卡片的分段锚
XHTML MP 支持对“ 段”锚的链接。在 Web 中可以见到这种情况,点击一个链接时,页面就向下滚动至当前页面的某个部分,也可是“回到顶部”的链接:
Help
...
<a name="h">Help text</a>
第 接显示文本Help。该链接被选中时,显示包含名为h的锚的文档部分。只有属性 name(没有属性href)的锚没有下划线并且无法被选中 们是具有属性 href="#anchor-name"的锚的不可见目标。
这是一种产生类似于WML“多卡片”行为的合理方法 XHTML页面的上端有一个 “ ” 链接,可以利用“ 跳至该页面的各个部分。例如,在页面底部可能有帮助文本,用户可以利用Help 链接迅速滚动到底部获取帮助文本。后退(Back)键能使用户返回到滚动前的位置,就如在Web浏览器中一样。
下面的程序段示例了一个锚元素,在此元素中对快捷键5 进行了定义,并将其链接到同一文档中的某个分段。
Help
------------------------------------------------------
发起电话呼叫
为在用户电话上创建一个能产生语音呼叫的锚:
调用 WMLScript 库函数wtai://wp/mc;NNN ,其中NNN 表示由数字组成的被呼电话号码。
Call 800 Info
该锚的显示与普通锚相同。当用户选中链接时,就会给出让用户确认呼叫号码的提示,然后将会拨通呼叫。
许多XHTML MP 浏览器还支持 i-mode tel: scheme,它是一个扩展,可以发起电话呼叫。可选属性cti="…"(如果存在的话)能够拨通号码,然后发送带有停顿(,)的 DTMF“ 音多频拨号音”,并且等待用户的确认(/)。<a>标签中的属性 href="tel:…"、 telbook="…"或 email="…"的任意组合都能启动移动设备的“ 电话簿”功能,并同时给出预设的可用数据。
Call John
执行上面语句将会拨出号码 8005551234,然后等待并提示用户按下 OK键以发送 DTMF 音频123。另外,还会启动“ 电话簿”选项功能,此选项功能在电话簿中把 tel: value(或 cti 的值,如果给出该值的话)保存到姓名 John Doe下,如果设备在电话簿中支持 e-mail 地址,它还将保存 e-mail 地址。
-------------------------------------------------------
保存到电话簿
为创建一个能在用户电话簿上保存姓名和号码的锚:
调用 WMLScript 库函数wtai://wp/ap;NNN;aaa ,其中 NNN 表示由数字组成的被呼电话号码,aaa表示由字母和数字组成的姓名。
[url=wtai://wp/ap;8005551234;John Doe]Save John Doe[/url]
-------------------------------------------------------
发送e-mail
许多支持发送 e-mail(如短消息服务[SMS],多媒体消息服务[MMS]或其它格式)的设备支持mailto: 方案 一个可以发送 e-mail消息的扩展:
Message to John
还可以在 URL中指定默认的 subject 和/或body以获得参数:
Message to John
--------------------------------------------------------
快捷键
设备显示屏上的链接使导航变得快捷,它们甚至是导航不可缺少的部分,尤其在文档较长时,使用链接可以跳至文档的某个部分。然而,即使使用链接,也需要把页面滚动到链接位置,因此为到达链接位置用户需要多次按键操作。
快捷键使用户通过一次按键就能激活可见的链接,而无需到达链接位置。在<a>元素中加入属性accesskey就能创建快捷方式。该属性值定义为了激活链接用户必须按下的键。
然而,为让用户知道应该按下哪个键,有必要用文本 在<a>元素之前的<p>元素中)说明为属性accesskey选择的按键号码。在文本中加入按键值可保证用户看到与描述锚目标的文本 起的快捷键值。例如,在内容中定义下行:
1 Next
导致如下显示:
1 Next
范例:
<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN"
"http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html mlns="http://www.w3.org/1999/xhtml">
<head>
<title>XHTML 1</title>
</head>
<body>
<a name="top"/>
<h2>Anchors</h2>
<p>
Bottom<br/>
1 File<br/>
2 Call Directory<br/>
3 <a href="mailto:joe@company.com?
subject=The%20Subject&
body=this%20is%20the%20message" accesskey="3">
Email Joe</a><br/>
Top<br/>
<a name="bottom"/>
</body>
</html>
--------------------------------------------------
菜单中的快捷键(Access-key)选项
在诺基亚移动浏览器和诺基亚 Series 40移动设备中,所有包含属性 accesskey的链接和提交按钮都被自动加入选项菜单中。选项菜单中的标签是元素<a>的文本 (如果元素<a>只包含一个图像,则是 img的属性alt 的值)或提交按钮的值。为匹配菜单,必要时需对文本 短。
这个功能确保用户总能快速获得主导航链接,不管滚动到了当前页面的何处。这与 WML 1.x 中的元素<do>功能相同(并且比<do>简单)。
包含属性 accesskey的锚和提交按钮都以它们在文档中出现的顺序被加入选项菜单中。
-------------------------------------------------
Forms
与 WML 不同,XHTML Form是利用提交按钮发送给服务器的,而 WML利用具有元素 postfield的锚。
可以利用 Form 中的CSS来提供具有 padding 和margin 属性的元素定位功能。此外,还支持 CSS 边界,但在诺基亚浏览器中,CSS边界出现在元素input、textarea和 select 中已经存在的黑色边界之外。
XHTML MP支持的窗体元素:
select textarea Optgroup option form Input label
XHTML MP 不支持下列各项:
<form>元素的属性accept-charset
任何元素的属性 tabindex 和 label
元素<fieldset>、<button>和<legend>
<input>元素中的type="button"
-------------------------------------------------
form 元素
Form 元素定义 action 和 method,二者都是用来向 Web 服务器发送Form 数据的。action 定义Form数据送往的服务器上的 URL。method 可以是get 或 post。
可以使用 method="get"发送 Form 数据作为附加在URL 之后的查询字符串值。例如:
<form method="get" action="form-process.cgi">
Name: <input type="text" name="uname"/><br/>
Password: <input type="password" name="pw"/>
</form>
将会请求使用如下URL的页面:
http://form-process.cgi?uname=Joe&pw=xyzzy
--------------------------------------------------
input 元素
input 元素用于输入短小文本 一行)或密码。用户通常利用input 元素输入用户名、密码、e-mail 主题、电话号码等。
XHTML MP 中支持的输入元素类型
Text Password Checkbox Submit Radio Reset Image Hidden
XHTML MP中不支持的HTML输入属性
Accept Align alt Disabled Ismap Readonly Usemap
范例:
<form action="form-process.xhtml" method="get">
First Name:
<input type="text" name="fname" title="First Name"
style="-wap-input-format:ammmmmm"/> <br/>
<input type="submit"/>
</form>
---------------------------------------------------
复选框
<input type="checkbox" name="..."/>
使用属性 checked="checked"定义默认情况下被选中的复选框。考虑服务的目标群体,判定哪个选项是大多数用户的可能选择,然后适当地把选项设定为选中或未选中。(注意,在 XHTML中,每个属性都必须有一个引用值,而HTML中布尔型属性可以省略这个值。)
---------------------------------------------------
单选按钮
<input type="radio" name="..."/>
在同一个 form 中,确保给每个单选按钮定义的name属性相同。
---------------------------------------------------
提交(Submit)或复位(Reset)按纽
<input type="submit"/>
<input type="reset"/>
---------------------------------------------------
文本 (textarea)元素
避免定义比内容区域还要大的文本 ,即使要求的输入长度超过文本区的大小。
---------------------------------------------------
选择(select)元素
如有可能,定义一个默认的选项(selected="selected")。
在一个单选列表(即不包含 multiple="multiple")中,如果选项元素都没有定义selected="selected",则选择列表的第一个选项将最先被选中。
在有语句 multiple="multiple"的选择列表(多选列表)中,如果选项元素都不包含selected="selected",则选择列表最初为空。
范例:
<form action="form-process.xhtml" method="get">
Choose City:<br/>
<select name="city">
<option value="Boston">Boston</option>
<option value="Dallas">Dallas</option>
<option value="SanFrancisco">San Francisco</option>
</select>
<br/>
<input type="submit" value="Continue"/>
</form>
---------------------------------------------------
隐藏字段
<input type="hidden"/>
如果你发现自己正在创建多个隐藏值,那么就可能在XHTML 页面中保存了太多“状态”,这使页面大小和Form请求大小比必需的大。可以使用大多数Web 服务器中可用的“session”功能,来将用户状态存储到服务器上的会话数据库中。
在 XHTML窗体中,可以使用单个隐藏字段来保存session ID,此ID将与各窗体请求一起发送。而一些 Web 服务器 session 工具使用cookie 保存当前的session ID。cookie值可以与每个页面请求一起发送,这增大了所有请求的大小,而隐藏值仅在提交 Form 时发送。
---------------------------------------------------
表格
与 WML 相比,具有WAP CSS的 XHTML MP使表格具有更好的布局。例如,在WML 中,不能修改和去除表格边界,但在具有WAP CSS 的XHTML中是可能的。
加入列标题(<th>)和表格标题(<caption>)是一个好主意。避免定义大于显示屏高度的表格单元。
XHTML MP 中不支持的表格属性
Align Cellpadding Cellspacing Border
与 XHTML MP一起使用的WAP CSS特性允许设计单元填充、页边空白、文本对齐和边界的样式,对左/右/上/下边界的控制是分开的。WAP CSS 还控制边界宽度以及色彩(在支持色彩的设备中)。
在 XHTML MP中,元素<td>和 <th>不支持属性width 或 height。
---------------------------------------------------
图像
在图像周围加入白色象素制造空白空间,这样可防止其它图像或周围的文本 粘”在图像边界上。这可以通过 WAP CSS 的属性margin实现。
在标记中显式地定义图像的高度和宽度,这样可使浏览器为图像预留合适的空间。
例如: [img]pics/header_main_page_001.gif" width="175" height="41[/img].
使用WAP CSS的属性float:left 或 float:right 使文本 于小于显示屏宽度一半的图像周围。与从新的一行开始的文本 悬浮文本 终端用户进行的滚动较少。
在<img>元素中利用属性alt 定义替换文本 果无法载入图像,多数浏览器将显示该文本。
在 XHTML MP中,<img>元素不支持属性 align、border、 hspace、vspace 和 usemap。
---------------------------------------------------
关于XHTML 的其它知识
软键
在诺基亚电话中,软键是固定的,并且不能被覆盖。左侧软键的标签为 Options(在输入文本 为 OK ),右侧软键的标签为 Back(在输入文本时为 Clear)。
在浏览过程中,Options软键使得用户在任何时候都能轻松访问所有浏览器相关选项。Back 软键使用户返回到先前访问的 XHTML 页面。
在诺基亚移动浏览器中,包含属性accesskey 的所有链接和提交按钮都被自动加入到选项菜单中。
脚本
在 XHTML MP中,不支持<script>元素和任何元素的script 属性。XHTML MP 包含元素<object> 和 <param>,但一些移动浏览器可能不支持它们。
Cookies
诺基亚移动浏览器的4.0 版本 过Nokia Activ Server网关以及其它网关支持标准的 HTTP cookie。
框架
在 XHTML MP中不支持框架。
扩展
诺基亚移动浏览器和许多其它 XHTML MP浏览器支持对 XHTML MP的扩展以保持与 CHTML的兼容性:
<blink> <marquee> <u> <dir> <menu>
tel: URI scheme, with cti, telbook, and email attributes
XHTML MP 和 WML 1.3 间的差别包括:
● 在 WML 1.3 中不使用XML 命名空间,但在 XHTML中使用。默认的命名空间是 XHTML。
● 在 XHTML MP中,去除了WML 的根元素<wml>。作为替代,一直把XHTML 的元素<html>用作根元素。
● 在 XHTML模块中,使用以下各项:XHTML Basic 中的所有元素、元素<hr>、行内属性<style>以及元素<b>、<big>、<I>和<small>。
● 在 XHTML MP中,元素<head>是必须的。在 WML 1.3 中,该元素是可选的。
● 在 XHTML MP中, WML 的元素<template>已经去除。
● 在 XHTML MP中, WML 的元素<card>已经去除,并用<body>代替。与 WML 1.x 中的<card>不同,一个文件中只能有一个<body>元素。
● 在 XHTML MP中去掉了 WML的属性ordered。
● 在 XHTML MP中不支持 WML事件,如:<do>、<ontimer>、<onenterforward>、<onenterbackward>、<onevent>、 <onpick>、<go>、<prev>、<noop>和<postfield>。
● 在 XHTML MP中不能使用WML 的元素<do>。
● 行内表格(即段落中的 WML 元素<table>)是合法的,但在标准 XHTML 中是非法的。但是,为支持从WML 1.3到 WML 2.0 的转换,在 XHTML MP 中允许使用行内表格,诺基亚移动浏览器也对此给予支持。
● 元素<pre>可以包含窗体控制元素<input>和<select>。这在XHTML中是非法的。但是,为实现从 WML 1.3到 XHTML MP的转换,XHTML MP 允许在<pre>中使用窗体元素,诺基亚移动浏览器也对此给予支持。
● 输入元素不支持 WML 的属性 format (用于控制被认可的输入字母),并用CSS 的新属性-wap-input-formal作为替代,该属性与WML 的属性format 具有相同的语法。具体写法:style="-wap-input-format:ammmmmm"
● XHTML MP 在元素<a>、<input>、<label>和<textarea>中支持属性 accesskey 。但要注意,可能所有设备都不支持accesskey。
● XHTML MP 中不支持WML 的格式化元素 <u>*。
在XHTML MP中实现格式化的推荐方法是使用 CSS类, 这可以通过在外部样式表中定义如下样式来完成:
.u {text-decoration:underline}
然后利用与类在一起的 span 元素来设置样式;
例如:
<span class="u">This is underlined</span>
● 在 XHTML MP中不支持其它 WML 1.x 元素。WAP 论坛定义了一个对 XHTML MP的扩展,该扩展被称为WML 2.0。WML 2.0 包含WML 1.x 的“兼容性”元素(如<wml:card>、 <wml:do>等)以实现WAP 网关从 WML1.x 到 WML 2.0 的自动翻译 。由于诺基亚移动浏览器原本 持 WML1.x ,翻译是不必要的,所以诺基亚移动浏览器不支持WML 2.0 。
------------------------------------------------
WAP CSS
1 引入外部文件
<link rel="stylesheet" href="mydoc.css" type="text/css"/>
2 文档头中的样式元素
<style> p {color: blue} </style>
3 使用XHTML的 style属性
<p style="color:red”>red
4 使用XHTML的 class属性
.class1 {padding-bottom:4px}
This paragraph will have bottom padding.
5 使用XHTML的 id属性
<style>
#myid {border-width: 1; border: solid; text-align: center}
<style>
<h1 id=”myid” >This heading has a solid border.</h1>
6 使用XHTML 的元素div 和 span
以上讨论了把由一个或多个元素定义的样式应用于内容,除此之外,还可以利用div 元素把样式(在样式表或<head>元素中被定义)应用于一系列元素或利用span元素把样式应用于一系列行内字符。
<div class=”test-case”>
This paragraph is blue.
Here are <span class=”test-id”>Test51 and Test52</span> specs.
</div>
-----------------------------------------
应避免的事项
● 避免使XHTML内容不能进行自动换行。也就是说,不要在属性white-space中使用值nowrap。
● 避免去掉锚(<a>元素)的下划线。也就是说,不要在锚中使用样式 text-decoration:none。
● 避免在普通文本 属性 text-decoration:underline。
● 避免过多地用属性font-style 和 font-variant 来强调文本 尤其在同一XHTML页面中。
● 避免在同一XHTML 页面中使用过多不同的字体类型(属性font-family)和字体大小(属性font-weigh 和font-size)。在一个XHTML 页面中,尽量把字体大小和字体类型限制在1 至3种。
WAP2.0 文档结构
必须包含<html>, <head>, <title>和<body> 元素。
<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Hello world</title>
</head>
<body>
Hello world. Welcome to taobao.com.
</body>
</html>
注意:
XML声明和字符编码:<?xml version="1.0" encoding="UTF-8"?>
UTF-8/16编码可省略。XML声明也不是必须的,但如果忽略在许多WAP浏览器中出错。
必须有DOCTYPE声明。在XML声明和<html>元素之间。
<html>、<head>、<title>、<body>必须要有
元素,align属性已经去除,可以通过WAP CSS的text-align属性来设置
WAP2.0与WAP1.0区别
WAP1.0基于WML语言开发,支持WMLScript
WAP2.0基于XHTML MP开发,支持WCSS
WAP1.0只能通过手机或特殊浏览器浏览。
WAP2.0开发的站点可以在WEB和无线上都可以使用,也可以用任何Web浏览器访问WAP2.0应用。
WAP2.0所不支持WAP1.0的特性
1.
XHTML MP 不支持<deck>和<card>标签
在XML中,一个文件可以包含一个或更多的card,所有的card组合成一个deck,并在无线设备中一同被下载。WAP浏览器每次只显示一
个card,可以通过锚链接访问其他的card。通过这些,减少了服务器的往返的访问。对性能的提高是有意义的。在XHTML MP中要实现类
似的特性,可以使用multipart messages(多个文档放到一个请求)另外一个方式是使用目标锚(一个页面的不同位置)。
2.XHTML MP 不支持<timer>标签
可使用<meta>代替定时器
<head> <meta http-equiv="refresh" content="10;URL=http://www.planabc.net/" /></head>
<meta>元素10秒后告诉WAP浏览器URL。
注意点:WML timer 仅当进入card,而HTML refresh timer当进入XHTML MP页面。
3.XHTML MP 不支持事件
WML支持四个事件(ontimer,onenterbackward,onenterforward,onpick),除ontimer其他事件无法模拟。如要使用,需使用WML1.X
4.XHTML MP 不支持变量
在XML,可以声明变量,并赋值,拥有全局作用域。可以在任何的deck和card中使用。XHML MP放在服务器端处理(必须发送并保存)。
5.XHTML MP 不支持客户端脚本
在XML,你可以使用客户端脚本(WMLScript)。JavaScript的简化版,常用来验证数据。放在服务器短处理。将来的版本将会支持客户
端脚本(ECMAScript MP),支持所有的WMLScript功能
6.XHTML MP 不支持可编程序软键(Programmable SoftKeys)
WML的一个最大特征。通过<do>标签使用。
在XHML MP中可以使用 accesskey 属性。锚链接和提交按钮支持这个属性:
<a accesskey="1" href="part1.xhtml">XHTML MP Tutorial Part 1</a>
WCSS中的-wap-accesskey属性也可以用来定义:a.wcss_class_1 {-wap-accesskey: 1}
7.
XHTML MP 不支持<u>标签
在XML,<u>用来在一些文字下添加下划线。可以用WCSS中的text-decoration属性。
8.
XHTML MP 不支持Input框的format属性
在XML,可以定义类型和字数限制。可以使用WCSS中的-wap-input-format属性,语法一致。
比如限制5个数字字符:input {-wap-input-format:"5N"}
9.
XHTML MP 不支持锚链接传输数据
WAP1.0 提交数据
<p> 姓名:
<input name="name"/><br/>
<anchor>
<go method="get" href="yuanxin.php">
<postfield name="name" value="$(name)"/>
</go>
提交
</anchor>
WAP2.0 提交数据
<form action="yuanxin.php" method="get">
姓名:
<input name="name"/><br/>
<input type="submit" value="提交"/>
</form>
WAP2.0 开发语言 XHTML 和 HTML的区别
1.
XHTML文件的开始要声明DTD
XHTML 1.0 Transitional//EN" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd
2.所有的标签都必须被关闭,空标签也不例外
HTML中的<br>要写成<br/>注意,后面加了一个空格" "和一个反斜杠"/"
3.所有的标签和标签的属性都必须小写,属性值可以大写
如错误代码:
<BODY>
<P>This is a paragraph</P>
</BODY>
正确格式为:
<body>
This is a paragraph
</body>
4.属性值必须用引号括起来。单引号双引号均可
错误的代码:
<table width=100%>
正确的代码:
<table width="100%">
5.XHTML 元素一定要被正确的嵌套使用
在HTML里一些元素可以不正确嵌套也能正常显示,如:
<b><i>This text is bold and italic</b></i>
而在XHTML必须要正确嵌套之后才能正常使用,如:
<b><i>This text is bold and italic</i></b>
6.如果你使用的是strict.dtd。也就是最严格的XHTML,那么许多定义外观的属性都将不被允许
例如你为图片添加链接的同时想去掉边框。不可以再使用<img src="..."border="0">,而是必须通过CSS来实现。
属性的缩写被禁止
错误的代码:
<dl compact>
<input checked>
<input readonly>
<input disabled>
<option selected>
<frame noresize>
正确的代码:
<dl compact="compact">
<input checked="checked" />
<input readonly="readonly" />
<input disabled="disabled" />
<option selected="selected" />
<frame noresize="noresize" />
HTML中可缩写的属性列表:
HTML XHTML
compact compact="compact"
checked checked="checked"
declare declare="declare"
readonly readonly="readonly"
disabled disabled="disabled"
selected selected="selected"
defer defer="defer"
ismap ismap="ismap"
nohref nohref="nohref"
noshade noshade="noshade"
nowrap nowrap="nowrap"
multiple multiple="multiple"
noresize noresize="noresize"
7.用id属性代替name属性
HTML 4.01 中为a,applet, frame, iframe, img 和 map定义了一个name属性.在 XHTML 里name属性是不能被使用的,应该用id 来替换它。如:
错误代码:
[img]picture.gif" name="picture1[/img]
正确的代码:
[img]picture.gif" id="picture1[/img]
注意:我们为了使旧浏览器也能正常的执行该内容我们也可以在标签中同时使用id和name属性。如:
[img]picture.gif" id="picture1" name="picture1[/img]
为了适应新的浏览器浏览加了/来结束标签。
发表评论
-
struts配置下载信息,处理InputStream
2013-04-24 12:23 844<action name="exportExc ... -
Js获取当前日期时间及其它操作
2013-04-17 11:49 1417Js获取当前日期时间及其它操作 var myDate = n ... -
Axis2开发创建WebService
2013-04-15 15:10 1067一、Axis2的下载和安装 1.可从http: ... -
myeclipse xifre
2013-04-09 17:33 10451. 首先新建一个web工程CxfService,倒入cxf所 ... -
全选,点击链接全选,选中多选框全选以及反选,全不选
2012-08-30 13:49 1199<html> <head> & ... -
全选/全不选
2012-08-29 17:38 1266<!DOCTYPE html PUBLIC " ... -
动感导航菜单
2012-08-29 16:28 945<html> <head> <t ... -
菜单栏
2012-08-29 16:23 1123<!DOCTYPE html PUBLIC " ... -
jquery
2012-08-29 14:42 736<html> <head> <s ... -
java遍历map
2012-08-28 17:30 889//最常规的一种遍历方法,最常规就是最常用的,虽然不复杂,但很 ... -
下拉列表,下列列表选中,下列列表删除,js判断下拉列表选中或删除
2012-08-28 14:47 1152下拉列表选中: var selObj = document.g ... -
spring 下配置 dbcp,c3p0,proxool 等数据源连接池
2012-08-16 11:39 1186spring 下如何配置 dbcp,c3p0,proxool ... -
鼠标移动到上面显示小手
2012-08-15 15:29 856<img id="<%=chan.tri ... -
dwr的web.xml配置及注意事项
2012-08-15 11:08 775<servlet> <servlet-n ... -
判断多选选中的数量大于2,选中多个值进行判断,提交action
2012-08-15 11:10 795function ValidateUsr(){ var ... -
判断多选选中的数量大于2,选中多个值
2012-08-09 15:54 815function ValidateUsr(){ var ... -
判断密码必须有大小写字母和数字组成
2012-08-09 15:52 5851<script language="JavaS ... -
判断访问的客户端
2012-08-09 09:41 772<SCRIPT LANGUAGE="JavaS ... -
js判断访问的是手机端,还是pc端
2012-08-09 09:38 1925<SCRIPT LANGUAGE="JavaS ... -
js验证密码必须为大小写字母和数字组成
2012-08-01 19:37 4709<script language="JavaS ...
相关推荐
在移动领域,XHTML MP(Mobile Profile)是专为无线应用协议(WAP)2.0设计的一种版本,它允许开发者构建高质量、互动性强的移动互联网应用。 XHTML MP的核心目标是提供与桌面互联网体验相似的功能,但考虑到移动...
设计XHTML MP内容,意味着我们需要关注如何创建适应移动设备显示的、结构良好且功能丰富的网页内容。 XHTML MP是在WAP(无线应用协议)框架下定义的,WAP是一种让移动设备通过无线网络访问互联网服务的技术标准。...
XHTML MP (XHTML Mobile Profile) 是 WAP 2.0 标记语言. XHTML MP 是 XHTML 的子集, HTML 和 XML 的结合. 本 XHTML MP 教程从对 XHTML MP 的介绍和各种标记语言, 如 WML, XHTML, XHTML Basic 和 XHTML MP, 之间的...
**XHTML MP 教程(带WCSS效果很牛X)** XHTML MP,全称为“eXtensible Hypertext Markup Language for Mobile”,是专为移动设备设计的一种简化版的XHTML标准,主要应用于WAP2.0环境。WAP2.0是第二代无线应用协议,它...
<p>XHTMLMP教程段落1 ``` 2. **标签和属性都必须是小写** - XHTML MP 要求所有标签和属性名称必须全部使用小写字母。例如: ```html <p id="p1">XHTMLMPtutorialparagraph1 ``` 3. **属性的值必须...
在设计XHTML MP内容时,有几点需要注意: - **响应式设计**:考虑到不同设备的屏幕尺寸和分辨率,页面布局应具有良好的自适应性,确保在不同设备上都能良好展示。 - **简化内容**:移动用户通常需要快速获取信息,...
XHTML MP (XHTML Mobile Profile) 是 WAP 2.0 标记语言. XHTML MP 是 XHTML 的子集, HTML 和 XML 的结合. 本 XHTML MP 教程从对 XHTML MP 的介绍和各种标记语言, 如 WML, XHTML, XHTML Basic 和 XHTML MP, 之间的...
### XHTML语言详解 #### 一、XHTML简介与背景 XHTML是HTML(HyperText Markup Language)的一个扩展版本,同时也是WML(Wireless Markup Language)的一种替代技术。随着3G移动互联网技术的发展,XHTML在WAP...
《wml_xhtmlMP中文手册》是一份详细阐述WML(Wireless Markup Language)与XHTML MP(Mobile Profile)技术的资源,适用于那些希望深入理解移动互联网内容制作和交互的开发者。WML和XHTML MP是WAP 2.0标准中的核心...
在开发XHTMLMP应用程序时,开发者需要注意以下几点: - **页面优化**:考虑到移动设备的屏幕大小和处理能力,页面设计应简洁、紧凑,避免过多的图片和复杂布局。 - **响应式设计**:利用CSS媒体查询实现不同设备屏幕...
【XHTML MP基础:手机网站开发的关键技术】 XHTML MP,全称为Extensible Hypertext Markup Language for Mobile Devices,是专为移动设备设计的一种简化版的XHTML标准,用于构建WAP 2.0网站,使其能在手机、PDA等...
4. **兼容性**:XHTML页面可以轻松转换为XHTML MP,有时甚至无需修改,只需注意适配小屏幕和文件大小。 5. **WCSS支持**:通过WCSS,开发者可以创建针对多种设备的样式,实现灵活的布局控制。 6. **表现控制增强**:...
### XHTML MP 开发知识点 #### 一、XHTML MP 概览 XHTML MP(Mobile Profile)是一种专门针对移动设备优化的XHTML版本,旨在帮助开发者创建能够在移动设备上高效运行的内容和服务。XHTML MP结合了XHTML 1.0 Strict...
XHTML 移动概要 (XHTML MP)WAP 2.0 教程
XHTML_MP是一种专门针对移动设备设计的XHTML简化版本,其主要目的是为了更好地适应移动网络环境,提高网页加载速度及优化用户浏览体验。XHTML_MP遵循了W3C(World Wide Web Consortium)制定的相关行业标准,并在...
核心组件之一是 **XHTML MP (eXtensible HyperText Markup Language Mobile Profile)**,这是一种专为移动设备设计的简化版XHTML。XHTML MP是WAP 2.0规范的一部分,它结合了 **WCSS (WAP Cascading Style Sheets)**...
WAP 2.0 是无线应用协议的一个重要升级,它引入了XHTML MP(XHTML Mobile Profile)和WCSS(WAP Cascading Style Sheet)来提升移动设备上的网页浏览体验。XHTML MP是XHTML的一个子集,专门针对移动设备进行了优化,...
WAP 2.0是WAP技术的升级版,引入了XHTML MP(eXtensible HyperText Markup Language Mobile Profile)和WCSS(WAP Cascading Style Sheets),显著提高了移动网络浏览体验。 **XHTML MP** 是XHTML的一个子集,专为...