• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >心得技巧 > 编写Web前端代码的注意事项小结

编写Web前端代码的注意事项小结

作者:佚名 字体:[增加 减小] 来源:互联网 时间:2017-08-06

本文主要包含Web,前端代码等相关知识,佚名 希望在学习及工作中可以帮助到您
1. 最好在html标签之前添加一句类似于

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

  的代码,该代码表示遵循W3C的某一套标准,具体使用哪套标准因人而异。

  使用该标准的好处是不用再为各种不同浏览器环境下网站的布局不一样的问题而烦恼。使用该标准后,笔者在IE8、FF、Safari浏览器环境下测试,结果页面显示均正常。另外,发现使用该标准后包括一些IE本身的bug也不再出现,如IE默认div框的高度要大于字体高度的bug,在遵循该标准后就不再出现。

  在遵循该标准后需要注意的一点是,有些写的不规范的代码可能就不能正常工作。例如在javascript中有roll1right.innerHTML = roll1left.innerHTML;的代码,其中roll1right和roll1left是网页上两个不同div的id,在没有套用该标准的情况下网页可以工作,但在W3C标准下该语句就出现bug。原因是W3C要求所有的变量都有明确的赋值,因此必须在该语句之前加上var roll1right = document.getElementById("roll1right");的语句,随后代码全部正常工作。

2. 在网页中使用div和table时,发现:虽然同样可以通过css设置div和table的border、margin、padding都为0,但是div显示正常的同时,table仍然会有一定的空隙。查询了W3CSchool后发现,原来table有cellpadding和cellspacing两个属性,其中cellpadding属性规定单元边沿与内容之间的空白,而cellspacing属性规定了单元之间的空白。于是将网页中的table的cellpadding和cellspacing两个属性都设为0,果然网页的table不再有空隙,问题解决。

您可能想查找下面的文章:

  • 浅谈前端网络、JavaScript优化以及开发小技巧
  • web网页开发面试笔试必备小知识(必看)
  • Web前端开发工程师需要掌握的核心技能
  • 分享10个最新的Web前端框架(翻译)
  • 前端开发必备常用工具函数小结
  • 0.1秒的价值!浅谈Web前端页面提速问题
  • Web前端开发中找错的基本思路
  • 怎么设计响应式WEB?响应式WEB设计的优缺点
  • 设计好用、易用web应用程序的10个技巧
  • 移动设备web开发关于html的head写法

相关文章

  • 2018-08-23优设网投稿规范
  • 2018-08-23秋风渐起,大咖们都跟随这些趋势做网页设计
  • 2018-08-23人工智能对设计有哪些影响?来看这篇超全面的总结!
  • 2017-08-06对div盒子模型使用心得总结
  • 2018-08-23顶尖设计师推荐:小米MIX2 的设计师菲利浦 · 斯塔克
  • 2018-08-23天猫App 首页迎来史上最大改版,背后的设计过程是这样的!
  • 2017-08-06深入理解::before/:before和::after/:after的使用
  • 2018-08-23新手科普文!什么是用户界面和体验设计?
  • 2018-08-23用一个AI教程,帮你学会运用黄金分割绘制图形
  • 2017-08-06搜索引擎免费收录网站入口小集

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • 简单实用!七步学会用 Sketch 搭建复杂表格
    • 上亿人使用的百度贴吧,是这么做设计改版的!
    • IE下utf8编码页面无端端空出一行及utf8页面无法显示的解决方法
    • 用QQ阅读的实战案例,帮你学会做理性的设计
    • UCAN 干货总结!阿里设计如何助力设计产业升级?
    • Sketch 新出了Libraries功能,以后团队协作更方便了!
    • 如何巧用线条,让你的Banner 更有设计感?
    • 还不知道什么是DPI和PPI的设计师,该收藏这篇教程了!
    • 网易设计师:图表设计,远不止“好看”这么简单
    • 交互设计师的产出物是什么? 来看Airbnb 设计师的答案!

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有