HTML简介

超文本标记语言(英语:HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言。HTML是一种基础技术,常与CSS、JavaScript一起被众多网站用于设计令人赏心悦目的网页、网页应用程序以及移动应用程序的用户界面[3]。网页浏览器可以读取HTML文件,并将其渲染成可视化网页。HTML描述了一个网站的结构语义随着线索的呈现,使之成为一种标记语言而非编程语言。

HTML元素是构建网站的基石。HTML允许嵌入图像与对象,并且可以用于创建交互式表单,它被用来结构化信息——例如标题、段落和列表等等,也可用来在一定程度上描述文档的外观和语义。HTML的语言形式为尖括号包围的HTML元素(如<html>),浏览器使用HTML标签和脚本来诠释网页内容,但不会将它们显示在页面上。

HTML可以嵌入如JavaScript的脚本语言,它们会影响HTML网页的行为。网页浏览器也可以引用层叠样式表(CSS)来定义文本和其它元素的外观与布局。维护HTML和CSS标准的组织万维网联盟(W3C)鼓励人们使用CSS替代一些用于表现的HTML元素[4]。

HTML常用标签解析

骨架标签

<!DOCTYPE html>
<html>
<head>
  <title></title>
</head>
<body>
</body>
</html>

<html></html> 创建一个HTML文档
<head></head> 设置文档标题和其它在网页中不显示的信息
<title></title> 设置文档的标题
<body></body> 定义 HTML 文档的主体

一些常用的标签

<h1></h1> 一级标题 
<p></p> 创建一个段落
<u></u> 下划线
<b></b> 粗体
<strong></strong> 表示重要性文本
<em></em> 表示强调
<i></i> 斜体字
注意:不要将<b>元素与 <strong>、<em>或<mark>元素混淆。 <strong>元素表示某些重要性的文本,<em>强调文本,而<mark>元素表示某些相关性的文本。 <b>元素不传达这样的特殊语义信息;仅在没有其他合适的元素时使用它。
<ol></ol> 创建有序列表
<ul></ul> 创建无序列表
<a href="xxx"></a>插入超文本链接
<img src="xxx">插入图片
<table></table> 插入表格
<div></div>块级元素,通用型的流内容容器,它可以被用来对其它元素进行分组
<span></span> 行内元素,短语内容的通用行内容器

iframe和a标签的联动:

<iframe src=xxxxx></iframe> 表示嵌套的浏览上下文,有效地将另一个HTML页面嵌入到当前页面中

<iframe src="./index2.html" frameborder="0"></iframe>
  <a href="http://baidu.com" target="_blank">百度</a> //在新页面打开
  <a href="http://baidu.com" target="_self">百度</a>  //在本窗口打开
  <a href="http://baidu.com" target="_parent">百度</a> //在父窗口打开
  <a href="http://baidu.com" target="_top">百度</a>    //在顶级窗口打开

form标签

form标签表示了文档中的一个区域,这个区域包含有交互控制元件,用来向web服务器提交信息。来看例子:

<!-- 一个简单的表单,这个表单会发送一个 GET 请求 -->
<form action="">
  <label for="GET-name">Name:</label>
  <input id="GET-name" type="text" name="name">
  <input type="submit" value="Save">
</form>

<!-- 一个简单的表单,发送 POST 请求 -->
<form action="" method="post">
  <label for="POST-name">Name:</label>
  <input id="POST-name" type="text" name="name">
  <input type="submit" value="Save">
</form>

<!-- 使用 fieldset, legend, and label 的表单 -->
<form action="" method="post">
  <fieldset>
    <legend>Title</legend>
    <input type="radio" name="radio" id="radio"> <label for="radio">Click me</label>
  </fieldset>
</form>

table标签

图片描述


Ether
7 声望0 粉丝

信息过载


« 上一篇
HTTP那些事
下一篇 »
CSS阶段总结