对编写html代码的几点儿小建议
1、DOCTYPE
说明:告诉浏览器要使用哪种规范来解释该文档
内容:
<!DOCTYPE html PUBLIC "-W3//DTD//XHTML 1.0 Transitional//EN" "http://www.w3.org/1999/xhmlt">
解释:-W3:w3标准;DTD:文档类型定义; XHTML 1.0:XHTML 1.0版本;Transitional:过渡模式(Strict:严格模式);EN:语言为英语; “http://www.w3.org/1999/xhtml” :w3官网标准文档所在地址;
以前刚开始的时候还会copy然后粘贴一下,现在连编辑器都没有了这个,直接来就是<!DOCTYPE html>完了,所以兼容性就会出现一些意想不到的东西,又很难找到,为了向下兼容还是明确的指出文档类型,文档解析规范,已将版本等。这是一个很好的习惯,更多的时候把注意力都放在了要用什么标签,哪个标签或者属性是什么意思,而很少去关注这些细节的东西。实在不是很可取呀。
2、 <meta http-equiv ="Content-Type" content="text/html;charset=utf-8" >
meta是对该文档的一个附加信息说明,可以使用meta来说明作者,网页的关键词,等很多的信息;现在都已经很少写这个了,还是建议写写这个,这个对搜索引擎的SEO优化是比较有用的。
3、标记名称、属性名称小写
有时候看的页面,实现的效果还是很不错的,但是打开源代码一看,惨不忍睹,很多的DIV TABLE,看上去很是不习惯,根据W3C的建议,还是统一使用小写比较好,这样可以很大程度上提高代码的可读性,对维护,重构都是有很大的好处的。不用再浪费时间在寻找标签上了。
4、标记严格嵌套
严格嵌套,使得HTML的文档结构性更强,<div><p></div></p>这样的代码是很容易让人不知所措的。
5、标记必须封闭(包括空元素)
标签是成对出现的,当然也有单个的(空元素),<p>开头,</p>结尾,这就是一堆封闭的标签对,<br><hr>这些就是空元素,但是建议空元素也要封闭,<br/>,<hr/>。
6、属性用引号括起
<img src=img/img1.jpg/> 这样是不建议使用的,<img src="img/img1.jpg" alt="您好"/>这样,用引号将属性值包裹起来,而且在使用引号时,建议保持一致性,属性值统一采用单引号或者双引号。
7、属性值使用完整形式
<input disabled> <input disabled="true">
8、区分内容标记与结构标记
<p>是内容标记,<table>是结构标记,不可将<table>置于<p>内部;
9、样式、行为与结构分离
将css样式单独写在一个文件里,使用<link rel="stylesheet" type="text/css" href="css/style.css"/>来引用。将js脚本单独放在一个文件里,使用<script tpye="texy/javascript" src="js/common.js"></script>来引用。而且将样式尽可能的放在一个文件中,放在文档的<head>部分引入,将js脚本也放在一个文件中,然后放在文档的底部,<body>之后引入。这样一方面能够减少对服务器的http请求次数,加快文档的下载速度。2.可以在文档的可视区域<body></body>之间的内容加载完了再加载js脚本,这样提升了体验的效果。
对编写html代码的几点儿小建议的更多相关文章
- 编写JavaScript 代码的5个小技巧
1.Array.includes 与条件判断 一般我们判断或用 || // condition function test(fruit) { if (fruit == "apple" ...
- iOS中书写代码规范35条小建议
1.精简代码, 返回最后一句的值,这个方法有一个优点,所有的变量都在代码块中,也就是只在代码块的区域中有效,这意味着可以减少对其他作用域的命名污染.但缺点是可读性比较差 NSURL *url = ({ ...
- 基于CkEditor实现.net在线开发之路(2)编写C#代码,怎么调用它。
上一章简约的介绍了CkEditor编辑器,可以编辑js逻辑代码,css,html,C#代码,这章我根据实际例子,讲解怎么编写C#代码和怎么调用它. 大家都还记得刚刚接触程序编时的hello Word吧 ...
- 最新的JavaScript核心语言标准——ES6,彻底改变你编写JS代码的方式!【转载+整理】
原文地址 本文内容 ECMAScript 发生了什么变化? 新标准 版本号6 兑现承诺 迭代器和for-of循环 生成器 Generators 模板字符串 不定参数和默认参数 解构 Destructu ...
- AppleWatch开发教程之Watch应用对象新增内容介绍以及编写运行代码
AppleWatch开发教程之Watch应用对象新增内容介绍以及编写运行代码 添加Watch应用对象时新增内容介绍 Watch应用对象添加到创建的项目中后,会包含两个部分:Watch App 和 Wa ...
- WEB开发:如何用js来模拟服务器的ajax响应,不依赖服务器来编写前端代码
一.问题的提出 目前web前端开发,主流的思路是: 1)编写静态的html文件(不使用模板技术,与服务器无关) 2)页面通过ajax与服务器交互,进行数据的传输,数据格式为json格式 这里存在一个问 ...
- 25 【python入门指南】如何编写测试代码
python如何编写测试代码 python内置了unittest,使得写应用层的单元测试变得超乎寻常的简单. 1,执行单个测试函数 #!/bin/python import unittest clas ...
- 初识Java程序,编写简单代码?
Dear All: 初识Java程序,编写简单代码? 首先小编在这里说下我们今天编写Java程序使用的是 eclipse 开发工具! 1.下载eclipse 官网地址:http://www.eclip ...
- How Javascript works (Javascript工作原理) (二) 引擎,运行时,如何在 V8 引擎中书写最优代码的 5 条小技巧
个人总结: 一个Javascript引擎由一个标准解释程序,或者即时编译器来实现. 解释器(Interpreter): 解释一行,执行一行. 编译器(Compiler): 全部编译成机器码,统一执行. ...
随机推荐
- 两个img之间出现间隙的解决方法
今天写了个小页面,发现了一个问题,两个包在a标签里的img之间总是有间隙,不能挨在一起,最后在同事的帮助下,找到解决的办法是,设置img的基线,css代码如下: img{vertical-align: ...
- mac 安装phpredis扩展
curl -O https://nodeload.github.com/nicolasff/phpredis/zip/master tar -zxf master cd phpredis-master ...
- struts_表单得到数据
在大家学习struts表达式语言的时候经常会遇到,从表单的提交上面得到数据, 而如何将表单的数据得到呢? 下面就介绍其中的一种方式: :以类的方式进行注入我们以login为例子 首先可以在struts ...
- kibana安装与基础用法
来自官网,版本为4.5 下载rpm包并安装 wget -c https://download.elastic.co/kibana/kibana/kibana-4.5.4-1.x86_64.rpm rp ...
- python 学习笔记十一 SQLALchemy ORM(进阶篇)
SqlAlchemy ORM SQLAlchemy是Python编程语言下的一款ORM框架,该框架建立在数据库API之上,使用关系对象映射进行数据库操作,简言之便是:将对象转换成SQL,然后使用数据A ...
- 第十四天 jni 的使用
1. ndk 环境 2.jni hello 程序. 3.javah 生成头文件. 4.java 和c 之间数据传递. 5.C语言回调java 代码 通过反射.得到字节码,得到方法...
- shell中 "" 跟 ''的区别
在bash里,这两个都是引号,用来表明字符串,区别是,双引号中的变量会被展开,而单引号中不再展开.举个例子:a="abc"echo "str=$a" # 结果显 ...
- Sprint(第三天11.16)
Sprint1第一阶段 1.类名:软件工程-第一阶段 2.时间:11.14-11.23 3.选题内容:点餐系统 4.团队博客地址:http://www.cnblogs.com/iamCarson/ 团 ...
- Oracle_下载地址
1.http://www.oracle.com/technetwork/cn/database/enterprise-edition/downloads/index.html 1.1.现在(20161 ...
- linux top命令
top命令参数 -h:help表示显示帮助的意思 -v:version显示版本的意思,和-h的功能一样 -u:user显示指定用户的进程,例如:top -u root -p:pid显示指定进程,例如: ...