整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
例
使用 <span> 元素对文本中的一部分进行着色：
<p>我的母亲有 <span style="color:blue">蓝色</span> 的眼睛。</p>
浏览器支持
所有主流浏览器都支持 <span> 标签。
标签定义及使用说明
<span> 用于对文档中的行内元素进行组合。
<span> 标签没有固定的格式表现。当对它应用样式时，它才会产生视觉上的变化。如果不对 <span> 应用样式，那么 <span> 元素中的文本与其他文本不会任何视觉上的差异。
<span> 标签提供了一种将文本的一部分或者文档的一部分独立出来的方式。
提示和注释
提示：被 <span> 元素包含的文本，您可以使用 CSS 对它定义样式，或者使用 JavaScript 对它进行操作。
HTML 4.01 与 HTML5之间的差异
NONE.
全局属性
<span> 标签支持 HTML 的全局属性。
事件属性
<span> 标签支持 HTML 的事件属性。
如您还有不明白的可以在下面与我留言或是与我探讨QQ群308855039，我们一起飞！
TML我们也学了那么久了，是时候看一些面试题了，毕竟学习完找工作要面试，你工作能力再强，面试这一关还是要过得。所以面试题占了很重要的成分。下面我来总结一部分，尽量全面一些，既要接近我们所学，又要满足真实面试场景。
1、请说出XHTML和HTML的区别
答： 1、文档顶部doctype声明不同，xhtml的doctype顶部声明中明确规定了xhtml DTD的写法；
2、html元素必须正确嵌套，不能乱；
3、属性必须是小写的；
4、属性值必须加引号；
5、标签必须有结束，单标签也应该用 “/” 来结束掉；
2、请写出至少5个HTML块元素标签
答： div p ul li table h1 h2 h3 ... h6 form 等
3、请写出至少5个HTML行内元素标签
答：span a i label img input button textarea select 等
4、请写出table标签下面会包含哪些标签元素
答： tr th td thead tbody tfoot 等
5、很多网站不常用table iframe这两个元素，知道原因吗？
答：因为浏览器页面渲染的时候是从上至下的，而table 和 iframe 这两种元素会改变这样渲染规则，他们是要等待自己元素内的内容加载完才整体渲染。用户体验会很不友好。
6、jpg和png格式的图片有什么区别？
答： jpg是有损压缩格式，png是无损压缩格式。所以，相同的图片，jpg体积会小。比如我们一些官网的banner图，一般都很大，所以适合用jpg类型的图片。但png分8位的和24位的，8位的体积会小很多，但在某些浏览器下8位的png图片会有锯齿。
7、请用html知识解决seo优化问题
答： 网站上线应该设置TDK
TDK就是 ：
然后就是html语义化标签，要简洁，合理，这样可以在css和js加载不全的时候，使我们的html文档尽量清晰的展示出来，而不会特别乱；
8、常用浏览器有哪些，内核都是什么？
答： 常用浏览器有 IE 火狐(firefox) chrome safari 360 搜狗 等
内核：IE的是 Trident
火狐的是 Gecko
chrome和safari 用的是 Webkit
360和搜狗这些分极速模式和兼容模式，极速模式用的Webkit的内核，兼容模式用的Trident内核。
9、请至少写出5个H5的新标签
答： header nav footer canvas datalist article mark
10、a标签在新窗口打开链接怎么加属性？
答： <a target="_blank">链接</a>
11、写了2个<a>标签，两个标签之间有空格的情况遇到过吗？
答：遇到过，一般换行写的时候会出现这种情况。代码：
<a>我们</a>
<a>你们</a>
这样“我们”和“你们”之间就会有明显的空格，如图：
怎么样，是不是空格挺明显的。
解决办法就是不换行写，把两个a标签写在一行里。
12、form标签上定义请求类型的是哪个属性？定义请求地址的是哪个属性？
答：form表单定义请求类型的是 method 属性 ， 定义请求地址的是 action属性
好啦，基本上html这部分面试题就这么多，肯定还有没有总结到的，这些面试题一定要会，甚至比我总结的多了更好。喜欢文章的小伙伴记得关注公众号：书软
<!DOCTYPE html>
<html>
<head>
<title>Page title</title>
</head>
<body> <img src="images/company_logo.png" alt="Company">
<h1 class="hello-world">Hello, world!</h1>
</body>
</html>HTML5 doctype在页面开头使用这个简单地doctype来启用标准模式，使其在每个浏览器中尽可能一致的展现；虽然doctype不区分大小写，但是按照惯例，doctype大写 （关于html属性，大写还是小写）。<!DOCTYPE html> <html> ... </html> lang属性根据HTML5规范：应在html标签上加上lang属性。这会给语音工具和翻译工具帮助，告诉它们应当怎么去发音和翻译。
更多关于 lang 属性的说明在这里；在sitepoint上可以查到语言列表；
但sitepoint只是给出了语言的大类，例如中文只给出了zh，但是没有区分香港，台湾，大陆。而微软给出了一份更加详细的语言列表.aspx)，其中细分了zh-cn, zh-hk, zh-tw。<!DOCTYPE html> <html lang="en-us"> ... </html> 字符编码通过声明一个明确的字符编码，让浏览器轻松、快速的确定适合网页内容的渲染方式，通常指定为’UTF-8’。<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> </head> ... </html> IE兼容模式用 <meta> 标签可以指定页面应该用什么版本的IE来渲染；<!DOCTYPE html> <html> <head> <meta http-equiv="X-UA-Compatible" content="IE=Edge"> </head> ... </html> 引入CSS, JS根据HTML5规范, 通常在引入CSS和JS时不需要指明 type，因为 text/css 和 text/javascript 分别是他们的默认值。HTML5 规范链接使用link
使用style
使用script<!-- External CSS --> <link rel="stylesheet" href="code_guide.css"> <!-- In-document CSS --> <style> ... </style> <!-- External JS --> <script src="code_guide.js"></script> <!-- In-document JS --> <script> ... </script> 属性顺序属性应该按照特定的顺序出现以保证易读性；
class是为高可复用组件设计的，所以应处在第一位；
id更加具体且应该尽量少使用，所以将它放在第二位。
<a class="..." id="..." data-modal="toggle" href="#">Example link</a>
<input class="form-control" type="text">
<img src="..." alt="...">
boolean属性指不需要声明取值的属性，XHTML需要每个属性声明取值，但是HTML5并不需要；
更多内容可以参考 WhatWG section on boolean attributes：
boolean属性的存在表示取值为true，不存在则表示取值为false。
<input type="text" disabled>
<input type="checkbox" value="1" checked>
<select>
<option value="1" selected>1</option>
</select>
在JS文件中生成标签让内容变得更难查找，更难编辑，性能更差。应该尽量避免这种情况的出现。
在编写HTML代码时，需要尽量避免多余的父节点；很多时候，需要通过迭代和重构来使HTML变得更少。
<!-- Not well -->
<span class="avatar">
<img src="...">
</span>
<!-- Better -->
<img class="avatar" src="...">
尽量遵循HTML标准和语义，但是不应该以浪费实用性作为代价；任何时候都要用尽量小的复杂度和尽量少的标签来解决问题。
*请认真填写需求信息，我们会在24小时内与您取得联系。
