首页 > 代码库 > 浅谈HTML基本语法
浅谈HTML基本语法
什么是 HTML?
HTML 是用来描述网页的一种语言。
HTML 指的是超文本标记语言 (Hyper Text Markup Language)
HTML 不是一种编程语言,而是一种标记语言 (markup language)
标记语言是一套标记标签 (markup tag)
HTML 使用标记标签来描述网页
HTML 标签
HTML 标记标签通常被称为 HTML 标签 (HTML tag)。
HTML 标签是由尖括号包围的关键词,比如 <html>
HTML 标签通常是成对出现的,比如 <b> 和 </b>
标签对中的第一个标签是开始标签,第二个标签是结束标签
开始和结束标签也被称为开放标签和闭合标签
HTML 文档 = 网页
HTML 文档描述网页
HTML 文档包含 HTML 标签和纯文本
HTML 文档也被称为网页
HTML 标题是通过 <h1> - <h6> 等标签进行定义的。
HTML 段落是通过 <p> 标签进行定义的。
HTML 链接是通过 <a> 标签进行定义的。
HTML 图像是通过 <img> 标签进行定义的。
HTML 表格是通过 <table> 标签定义的。
HTML 注释是通过 <!--> 标签定义的。
HTML 文档是由 HTML 元素定义的。
HTML 元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码。
没有内容的 HTML 元素被称为空元素。空元素是在开始标签中关闭的。
<br/> 就是没有关闭标签的空元素(<br/> 标签定义换行)。
在 XHTML、XML 以及未来版本的 HTML 中,所有元素都必须被关闭。
在开始标签中添加斜杠,比如 <br />,是关闭空元素的正确方法,HTML、XHTML 和 XML 都接受这种方式。
属性为 HTML 元素提供附加信息。
<h1 align="center"> 拥有关于对齐方式的附加信息。
<body bgcolor="yellow"> 拥有关于背景颜色的附加信息。
<table border="1"> 拥有关于表格边框的附加信息。
属性值应该始终被包括在引号内。双引号是最常用的,不过使用单引号也没有问题。
在某些个别的情况下,比如属性值本身就含有双引号,那么您必须使用单引号。
<hr /> 标签在 HTML 页面中创建水平线。
hr 元素可用于分割内容。
注释:开始括号之后(左边的括号)需要紧跟一个叹号,结束括号之前(右边的括号)不需要。
如果您希望在不产生一个新段落的情况下进行换行(新行),请使用 <br /> 标签。<br /> 元素是一个空的 HTML 元素。由于关闭标签没有任何意义,因此它没有结束标签。
定义图像的语法是:<img src="http://www.mamicode.com/url" />URL 指存储图像的位置。如果名为 "boat.gif" 的图像位于 www.w3school.com.cn 的 images 目录中,那么其 URL 为 http://www.w3school.com.cn/images/boat.gif。
alt 属性用来为图像定义一串预备的可替换的文本。替换文本属性的值是用户定义的。<img src="http://www.mamicode.com/boat.gif" alt="Big Boat">
表格由 <table> 标签来定义。表格的表头使用 <th> 标签进行定义。每个表格均有若干行(由 <tr> 标签定义),每行被分割为若干单元格(由 <td> 标签定义)。字母 td 指表格数据(table data),即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。
无序列表始于 <ul> 标签。每个列表项始于 <li>。有序列表始于 <ol> 标签。每个列表项始于 <li> 标签。自定义列表以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始。
块级元素在浏览器显示时,通常会以新行来开始(和结束)。例子:<h1>, <p>, <ul>, <table>
内联元素在显示时通常不会以新行开始。例子:<b>, <td>, <a>, <img>
<div> 元素没有特定的含义。除此之外,由于它属于块级元素,浏览器会在其前后显示折行。<div> 元素的另一个常见的用途是文档布局。它取代了使用表格定义布局的老式方法。使用 <table> 元素进行文档布局不是表格的正确用法。<table> 元素的作用是显示表格化的数据。
表单是一个包含表单元素的区域。表单使用表单标签(<form>)定义。
<form name="input" action="html_form_action.asp" method="get">
Username:
<input type="text" name="user" />
<input type="submit" value="http://www.mamicode.com/Submit" />
</form>
假如您在上面的文本框内键入几个字母,然后点击确认按钮,那么输入数据会传送到 "html_form_action.asp" 的页面。该页面将显示出输入的结果。
Frame 标签定义了放置在每个框架中的 HTML 文档。假如一个框架有可见边框,用户可以拖动边框来改变它的大小。为了避免这种情况发生,可以在 <frame> 标签中加入:noresize="noresize"。
为不支持框架的浏览器添加 <noframes> 标签。
不能将 <body></body> 标签与 <frameset></frameset> 标签同时使用!不过,假如你添加包含一段文本的 <noframes> 标签,就必须将这段文字嵌套于 <body></body> 标签内。(在下面的第一个实例中,可以查看它是如何实现的。)
iframe 用于在网页内显示网页。height 和 width 属性用于规定 iframe 的高度和宽度。frameborder 属性规定是否显示 iframe 周围的边框。<iframe src="http://www.mamicode.com/demo_iframe.htm" frameborder="0"></ifrrame>
着重看下框架和布局
浅谈HTML基本语法