HTML、XML、XHTML 有什么区别
- HTML全名为超文本标记语言(Hyper Text Markup Language),是用于创建Web的标准的标记语言,语法松散,不严格,编码不规范,表现、结构混乱。
- XML是可扩展标识语言(The eXtensible Markup Language),比html更为严格,用途是定义结构、存储信息、传送信息。
- XHTML是可扩展超文本标记语言(eXtensible HyperText Markup Language),是一种标记语言,基于XML,表现方式与超文本标记语言HTML类似,不过语法上更加严格。
怎样理解 HTML 语义化
语义化是数据和表述的本体的映射成为可能,首先表达出结构,并且通过一些结构的直接声明(约定俗成)让计算机可以找到这些结构的本体,然后计算机就可以通过本体的关系来进行逻辑演绎。我们目前可用的技术里面应该充分的考虑到计算机非常弱的理解能力,尽量说一些约定俗成的东西,这样机器人就可以帮我们进行一些我们人类不太擅长但是它很擅长的推理计算了。那么最好我们能够让我们的文档在描述相关的本体的时候使用计算机更容易理解的结构,这就是语义化。也就是说用某一种模式来表达计算机可以理解的词汇,这就是HTML的语义化。
通俗概括,语义化是为了让计算机能够很好的通过自描述的结构逐渐掌握我们人类的词汇,理解我们人在说什么,这样它就可以更好的为我们服务。
怎样理解内容与样式分离的原则
之前说到语义化是为了让计算机更好地理解我们人所要表达的内容
,因此我们必须回归内容本身,将内容本身的语义合理地表述出来,
再为不同的用户代理设计不同的样式描述,这就是内容与样式分离。
内容与样式分离
一方面 ,简化从全面重新设计到轻微设计调整的任何更改,对其中一部分内容或样式的更改使你无需改变其余整体。
另一方面,一篇文档的实际内容和意义,与这篇文档呈现给读者的方式,是相互独立的
这使得它很容易在同一内容应用不同的样式,即为不同的用户代理设计不同的样式描述。
有哪些常见的meta标签
1、指定字符集:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
2、向搜索引擎说明你的网页的关键字:
<meta name="keywords" content="关键字"/>
3、告诉搜索引擎你的站点的主要内容:
<meta name="description" content=""/>
4、告诉搜索引擎你的站点的制作的作者:
<meta name="author" content=""/>
5、定时让网页在指定的时间n内跳转
<meta http-equiv="refresh" content="n;url="/>
6、勇于设定网页的到期时间,一旦过期则必须到服务器上重新调用,需要注意的是必须使用GMT时间格式:
<meta http-equiv="expires" content="Mon,12 May 2010 00:00:00 GMT"/>
7、禁用缓存:
<meta http-equiv="pragma" content="no-cache"/>
8、cookie设定,如果网页过期,存盘的cookie将会被删除,需要注意的是也必须使用GMT时间格式:
<meta http-equiv="set-cookie" content="Mon,12 May 2010 00:00:00 GMT" />
9.浏览器的内核控制
<meta name="renderer" content="webkit|ie-comp|ie-stand">
文档声明的作用?<!doctype html> 的作用?
<!DOCTYPE> 声明处于 <html> 标签之前。此标签可告知浏览器文档使用哪种 HTML 或 XHTML 规范。在制作网页时都需要定义文档的类型,即doctype。如果不声明网页的文档类型,浏览器在解析的时候会以混杂模式解析网页代码,不同的浏览器下,混杂模式解析的网页效果差别很大,会造成网页布局排版的错位,因此在写html代码前有必要写明文档类型。
严格模式和混杂模式指什么?
Doctype可声明三种DTD类型,分别表示严格版本、过渡版本以及基于框架的 HTML 文档。
当浏览器厂商开始创建与标准兼容的浏览器时,他们希望确保向后兼容性。为了实现这一点,他们创建了两种呈现模式:严格模式和混杂模式
严格模式是浏览器根据web标准去解析页面,是一种要求严格的DTD,不允许使用任何表现层的语法,在严格模式中,浏览器以其支持的最高标准呈现页面,;
在混杂模式中,页面以一种比较宽松的向后兼容的方式显示。混杂模式通常模拟老式浏览器的行为以防止老站点无法工作。
模式触发
触发严格模式
触发严格模式很简单,就是正常的建立网页,声明正确的DTD,便是严格模式。
触发混杂模式
而混杂模式的触发可以通过在HTML文档开始不声明DTD,或者在DOCTYPE前加入XML声明<?xml version=”1.0〃 encoding=”utf-8〃?>
来实现
浏览器乱码的原因是什么?如何解决
产生乱码的原因一般是文档没有声明自身的编码导致浏览器错误地使用了与文档不同的解码方式,从而导致内容无法正常显示
一定要清楚文件保存时的编码方式并在文件内声明
常见的浏览器有及其内核
浏览器 | 内核 |
---|---|
IE浏览器(IE4以上) | Trident内核(IE内核) |
Mozilla Firefox | Gecko |
Google Chrome | 前期webkit(苹果),如今blink |
Opera | blink |
Safari | webkit |
搜狗浏览器、傲游浏览器、QQ浏览器 | 兼容模式(IE:Trident)和高速模式(webkit) |
360极速浏览器 | 基于谷歌(Chromium)和IE内核 |
360安全浏览器 | IE内核 |
Netscape | Gecko |
常见的标签及其应用场景
标签 | 场景 |
---|---|
<html>...</html> | 将所有HTML内容都包含在这个标签内 |
<head>...</head> | 用于定义文档的头部,它是所有头部元素的容器。 |
<title>...</title> | 文档的标题 |
<meta>...</meta> | 提供有关页面的元信息 |
注释 | |
bgcolor | 页面背景色 |
text | 文字颜色(规定所有文本颜色) |
topmargin | 上页边距 |
leftmargin | 左页边距 |
rightmargin | 右页边距 |
bottomargin | 下页边距 |
background | 背景设置 |
<font color="" face="" size=""></font> | 控制字体;color="颜色";face,字体;size,字体大小。 |
< b > < /b > | 字体加粗 |
< i >< /i > | 倾斜 |
< u>< /u > | 下划线 |
< strong >< /strong > | 字体加粗(强调,语气加强用) |
< em >< /em > | 字体倾斜(强调,语气加强用) |
<center></center> | 居中。 |
< u >< /u > | 下划线 |
h1~h6 | 标题(会自动换行)。HTML标题(Heading)是通过h1~h6 等标签进行定义的。重要性依次递减 |
< p > < /p > | 段落标签(段落之间空行) |
<div></div> | 层标签(默认占一行) |
< span > < /span > | 层标签(默认用多大空间占多大空间) |
< ol type="1 " > < li> < /li> < /ol> | --有序列表,序号为1,2,3……,引号中可以更改序号形式,ol改为ul则为无序列表,不具备自动换行 |
<a href="超链接地址" target=“_blank”>超链接的文字</a> | 超链接标签,href(hyperlink reference);_blank是在新窗口打开 |
< i m g src="图片地址" alt="文字" width="" height="" / > | 图片链接标签,高跟宽设置一个即可,显示图片会按比例缩放。alt在图片无法加载时,显示文字,还可帮助搜索引擎搜索。< img / >必须单独出现。 |
<table></table> | 表格 |
width | 宽度,可以用像素或百分比表示。常用960像素。 |
border | 边框,常用值0。 |
cellpadding | 内容跟单元格边框的边距。常用值0。 |
cellspacing | 单元格之间的间距。常用值0。 |
<tr></tr> | 行 |
<td></td> | 单元格 |
<th></th> | 表头,单元格的内容自动居中、加粗 |
align | :一行的内容的水平对齐方式 |
colspan="n" | 合并同一行单元格(后面写代码要减去相对应的列) |
rowspan="n" | 合并同一列单元格(从第二行开始减去对应的列) |
< a >...< /a > | 定义锚,即在页面插入链接 |
< q >...< /q > | 定义短引用 |