丐帮资源网

跨浏览器开发经验总结（一） HTML标记
站长资源 2024/12/28 佚名
2 0

为页面添加DOCTYPE
由于不同浏览器对标签,样式表的解释不尽相同,所以需要为html文件定义一个标准的文档类型,使不同浏览器尽量按照一个统一的html标准来解析渲染页面。

!DOCTYPE 声明指定文档遵从的 DTD，如：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

标准HTML标签的正确使用
尽量使用div+css布局,不用table做布局。
使用table做布局容易造成代码冗余，相对<div></div>编写来说，代码繁多。并且，table需要将元素都下载后进行显示，相应的网页打开速度也较慢。

应该使用标准化的页面结构：DIV+CSS。这种布局方式代码简洁，页面浏览速度较快，页面布局灵活，改版时只需改CSS样式即可实现页面重新布局，而不用改动程序，从而降低了网站改版的成本。

注意标签的闭合关系,尤其是在form标签中嵌套div等其他标签时。
有的时候页面上会出现多余的空白，即使重新设置了margin也无法避免，这个时候有可能是页面元素标签闭合出现了不配对的情况，如：

<div class=”outer”>
<form name=”testForm”>
<div class=”inner”>
<input name=”title” type=”text” />
</form>
</div>
</div>

定义table时使用tbody元素，以保证包括IE在内的所有浏览器可正确使用
即使table没有显示定义tbody元素,浏览器也会认为tr节点的父节点是一个自动添加的默认tbody节点.为了避免使用javascript操纵tr节点时可能产生的误会, 还是手动添加一个比较好，如：

<table id=”myTable”>
<tbody id=”myTableBody”>
<tr>
<td>
</td>
</tr>
</tbody>
</table>

注意标签及属性的大小写
有的时候，有些绑定在元素上的事件在IE浏览器下响应，在safari或其他浏览器下却不响应。这时候需要检查事件绑定方式的正确性，高级事件的绑定需要区别IE和其他浏览器写两套javascript，而简单事件模型需要注意一下绑定事件名的大小写。如：

<input type=”text” name=”keywordSearch” onFocus=”clearValue()” >

这里应该用小写的onfocus，并且显示的添加标签闭合符号才是规范的写法。

<input type=”text” name=”keywordSearch” onfocus=”clearValue()” />



注意标签的属性值设置
<script>标签的language和type属性
<script>标签的language属性是用来定义脚本语言版本的，正确的赋值应该形如<script>用来告诉浏览器（主要是IE）使用1.2版本的javascript语法来解释；而type属性才是用来定义脚本类型的，是w3c的标准属性，并且使用小写属性才是符合标准的做法。如果不是特别情况下需要告诉浏览器按照较低版本的javascrip语言进行解释的话（目前大多数浏览器支持的javascript版本是1.5），一般不需要定义language属性，但是type属性是需要定义的。所以应该把代码中的

<SCRIPT Language="JavaScript">改为<script>

<a>标签的alt和title属性
虽然alt和title这两个属性的值在IE下都会以tool tip的方式在鼠标悬停时显示，但是二者还是有区别的。alt是图片没有显示出来的时候的替代显示，而title才是鼠标放到上面时的提示。

<input>标签的checked、readonly属性
在早期版本的HTML中，并没有强制规定所有的属性都应该赋值，在表示一个选中的复选框时，<input checked > 这样的写法是被认可的。但是根据XHTML的标准，这样的文法并不是一个严格的XML格式，应该注意对属性的赋值和标签的闭合，以顺应HTML标准发展的趋势，写成这样：

<input checked="checked" />

<input readonly="readonly" />

<option>标签的select ed属性

与上一条相同的理由，<select>选项中<option>标签的selected属性也应该赋值：

< option selected="selected" />

<img>标签的 align="absmiddle" 属性
根据XHTML的标准，HTML标签应该专注于内容的表示，而不是样式的控制，样式应该交给CSS调整。所以废弃了一些旧的标签和属性，比如<em>标签和<i>标签都会让标签内容中文字以斜体显示，但是<i>标签这种单纯以样式命名的标签已经属于废弃的标准了，取而代之的是表示emphasis（强调）含义的<em>标签。同理，<img>标签的和align="absmiddle" 属性表示该图片和相邻文字垂直居中对齐，这也是表示样式的属性，应该使用CSS而不是这个属性来控制图片的对齐样式，避免两处样式控制的相互影响。

<iframe>标签的frameborder属性
在使用iframe时，IE中或许只要设置border=“0”就可以不显示iframe的边框了，但是标准的控制frame窗口边框的属性是frameborder，应该设置frameborder=“0”才能在IE之外的其他浏览器中同样隐藏frame的边框：

<iframe frameborder="0" />

<table>标签的cellpadding属性
这个属性同<img>标签的 align属性一样，也是一个僭越了HTML自身表示内容的职责而控制样式的一个属性，它规定的是单元之间的空间。从实用角度出发，最好不要规定 cellpadding，而是使用 CSS 来控制单元格的内边距。

<td>标签的nowrap属性

nowrap是表示内容不自动换行的属性，但是同上面的属性一样，这是一个控制样式的属性。在 HTML 4.01 中，<td>标签的 "bgcolor"、"height"、"width" 以及 "nowrap" 是不被赞成使用的。在 XHTML 1.0 Strict DTD 中，<td>标签的 "bgcolor"、"height"、"width" 以及 "nowrap" 是不被支持的。

广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
www.yaopr.com 丐帮资源网
39,976影音资源
44,792技术资源
21,817软件资源
651,128站长资源
一句话新闻
苹果官宣WWDC 2024！预计会有大批AI功能 - 2024/12/28

3月27日消息，苹果宣布2024年全球开发者大会（WWDC）将于6月10日至6月14日举行，巧合的是，这次大会与端午假期重合。

苹果官方表示：

在线参加 Apple 每年规模最大的开发者盛会。亲眼见证 Apple 最新平台、技术和工具的发布。了解如何创建和改进你的 App 和游戏。与 Apple 设计师和工程师互动交流，与全球开发者社区建立联系。以上活动均免费在线举行。

探索各种新的工具、框架和功能，助力你打造出理想的 App 和游戏。通过视频讲座学习新技能，与 Apple 专家进行一对一会面，以推进你的项目，完善你的构思。

Swift Student Challenge 旨在支持和鼓舞下一代开发者、创作者和企业家。太平洋时间 3 月 28 日，我们将公布今年的获奖者名单。获奖者将有资格参加在 Apple Park 举办的特别活动。我们还会选出 50 名杰出获胜者，他们将受邀前往库比提诺，获得为期三天的非凡体验，包括参加 Apple Park 的特别活动。

RTX 5090要首发 性能要翻倍！三星展示GDDR7显存

三星在GTC上展示了专为下一代游戏GPU设计的GDDR7内存。

首次推出的GDDR7内存模块密度为16GB，每个模块容量为2GB。其速度预设为32 Gbps（PAM3），但也可以降至28 Gbps，以提高产量和初始阶段的整体性能和成本效益。

据三星表示，GDDR7内存的能效将提高20%，同时工作电压仅为1.1V，低于标准的1.2V。通过采用更新的封装材料和优化的电路设计，使得在高速运行时的发热量降低，GDDR7的热阻比GDDR6降低了70%。

更新日志

友情链接

杰晶网络 DDR爱好者之家 桃源资源网 杰网资源 富贵资源网 南强小屋 铁雪资源网 幽灵资源网 万梅资源网 狼山资源网 白云岛资源网 昆仑资源网 相思资源网 明霞山资源网 内蒙古资源网 黑松山资源网 茶园资源网 饿虎岗资源网 大旗谷资源网 常春岛资源网 岱庙资源网 兴国资源网 快活林资源网 蝙蝠岛资源网 帝王谷资源网 白云城资源网 伏龙阁资源网 清风细雨楼 天枫庄资源网 圆月山庄资源网 无争山庄资源网 神水资源网 移花宫资源网 神剑山庄资源网 无为清净楼资源网 金钱帮资源网 丐帮资源网 华山资源网 极乐门资源网 小李飞刀资源网 凤求凰客栈 风云阁资源网 金狮镖局 鸳鸯亭资源网 千金楼资源网 更多链接