HTML、XML、XHTML有什么区别?
HTML (HyperText Markup Language)超文本标记语。,主要用来显示数据。对 语法要求不严格,浏览器会尽力去解析其代码,尽管代码不规范。
XML(EXtensible Markup Language)可扩展标记语言。目的是为了传输和存储数据,其焦点是数据的内容,标签没有被预定义,需要自行定义标签。
XHTML(Extensible HyperText Markup Language)可扩展超文本标记语言。是HTML 与XML的结合物,更严格更纯净的 HTML。
怎样理解 HTML 语义化?
HTML语义化是指使用合适的标签来体现HTML文档的结构,根据内容的结构、用途来选择适当的标签,避免用标签来指定样式。
语义化后的标签有一下优势:
- 在没有CSS的情况下,页面也能呈现出很好地内容结构、代码结构。
- 有利于SEO:和搜索引擎建立良好沟通,有助于爬虫抓取更多的有效信息。
- 便于团队开发和维护,语义化的HTML可以让开发者更容易的看明白,从而提高团队的效率和协调能力。
- 用户体验:例如title、alt用于解释名词或解释图片信息、label标签的活用。
- 能够适应各种各样的设备。
怎样理解内容与样式分离的原则?
内容与样式分离就是网页的内容和结构由HTML负责,而由CSS来负责样式。分离后,内容和样式更加清晰,之后修改更加方便,便于团队的开发和维护。
有哪些常见的meta标签?
参考HTML meta标签总结与属性使用介绍
常用meta整理
<meta>标签提供关于HTML文档的元数据。元数据不会显示在页面上,但是对于机器是可读的。它可用于浏览器(如何显示内容或重新加载页面),搜索引擎(关键词),或其他 web 服务。
必要属性
属性 | 值 | 描述 |
---|---|---|
content | some text | 定义与http-equiv或name属性相关的元信息 |
可选属性
属性 | 值 | 描述 |
---|---|---|
http-equiv | content-type / expire / refresh / set-cookie | 把content属性关联到HTTP头部。 |
name | author / description / keywords / generator / revised / others | 把 content 属性关联到一个名称。 |
content | some text | 定义用于翻译 content 属性值的格式。 |
-
<meta name="keywords" content="">
向搜索引擎说明你的网页的关键词 -
<meta name="description" content="">
告诉搜索引擎你的站点的主要内容 -
<meta name="author" content="你的姓名">
告诉搜索引擎你的站点的制作的作者 -
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
指定字符集 -
<meta http-equiv="refresh" content="n;url=">
定时让网页在指定的时间n内跳转 -
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
指定IE和Chrome使用最新版本渲染当前页面 <meta name="robots" content="index,follow" />
- all:文件将被检索,且页面上的链接可以被查询;
- none:文件将不被检索,且页面上的链接不可以被查询;
- index:文件将被检索;
- follow:页面上的链接可以被查询;
- noindex:文件将不被检索;
- nofollow:页面上的链接不可以被查询。
- 移动设备
<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no"/>
width:宽度(数值 / device-width)(范围从200 到10,000,默认为980 像素)
height:高度(数值 / device-height)(范围从223 到10,000)
initial-scale:初始的缩放比例 (范围从>0 到10)
minimum-scale:允许用户缩放到的最小比例
maximum-scale:允许用户缩放到的最大比例
user-scalable:用户是否可以手动缩 (no,yes)
文档声明的作用?严格模式和混杂模式指什么?<!doctype html> 的作用?
- <!DOCTYPE>声明叫做文件类型定义(DTD),声明的作用为了告诉浏览器该文件的类型。让浏览器解析器知道应该用哪个规范来解析文档。<!DOCTYPE>声明必须在 HTML 文档的第一行,这并不是一个 HTML 标签。
- 严格模式:又称标准模式,是指浏览器按照 W3C 标准解析代码。
混杂模式:又称怪异模式或兼容模式,是指浏览器用自己的方式解析代码。 - <!DOCTYPE html>告诉浏览器以html5的规范来解析该文档。
浏览器乱码的原因是什么?如何解决?
参考字符编码
浏览器乱码的原因是并不知道应该采取何种方式进行解码,也就是说并不清楚该文档的编码类型。
可以在meta标签中用charset指定页面的编码方式,现在一般用UTF-8,支持多种语言。
常见的浏览器有哪些,什么内核?
浏览器 | 内核 | css实现兼容 |
---|---|---|
Chrome和Android浏览器 | WebKit | -webkit |
Safari | WebKit | -webkit |
IE | Trident | -ms |
Firefox | Gecko | -moz |
Opera | Presto | -o |
列出常见的标签,并简单介绍这些标签用在什么场景
标签 | 语义 |
---|---|
<h1> ~<h6>
|
标题 |
<a> 、<p> 、<img> 、<button>
|
超链接、段落、图片、按钮 |
<table> 、<tr> 、<th> 、<td>
|
表格、表格中一行、表格头部单元格、表格内容单元格 |
<ul> 、<ol> 、<li>
|
有序列表、无序例表、列表项 |
<dl> 、<dt> 、<dd>
|
定义列表、定义标题、定义内容 |
<em>``<strong> |
都是强调,<strong> 程度高 |
<div> 、<span>
|
用作划分布局等,div为块,span为行内元素 |
<q> 、<blockquote>
|
短引用、块引用 |
<iframe>
用法
<iframe src="http://baidu.com" name="myPage"></iframe>
<p><a href="http://www.w3cschool.cc" target="myPage">W3Cschool.cc</a></p>
可以用来嵌入一个页面,注意<a>
标签中target属性与<iframe>
中name属性的关系。注意跨域操作问题。