标签"/>
网页前端培训1HTML/基础标签
HTML
简介：超文本标记语言是一种用于创建网页的标准标记语言，不是编程语言。“超文本”指网页内可以包含非文字元素如：图片、链接、音乐等。HTML文档也叫web页面。
后缀名：.html .htm本身几乎没有任何区别。
基础语法：
标签：标签又叫做元素，由尖括号包围的关键词，比如 <html>，通常是成对出现的，HTML 元素以开始标签起始，HTML 元素以结束标签终止，开始和结束标签也被称为开放标签和闭合标签。某些 HTML 元素具有空内容。
标签属性：可以在元素中添加附加信息，一般描述于开始标签。
文档：通过<html> 标签定义整个 HTML 文档
<html>...</html>头部：<head> 元素包含了所有的头部标签元素。在 <head>元素中你可以插入脚本（scripts）, 样式文件（CSS），及各种meta信息。
主体： <body> 标签定义文档的主体。
<body>
<p>这是第一个段落。</p>
</body>文档标题： <title> 标签定义了不同文档的标题
标题：通过<h1> - <h6> 标签来定义，重要性依次递减，起强调作用，用在主体中，自动换行
<h1>这是一个标题</h1>
<h2>这是一个标题</h2>
<h3>这是一个标题</h3>水平线： 通过 <hr> 标签进行分隔，常用属性：color，size，width（百分比或px）,align对齐方式
<p>XXXXXXXX</p>
<hr color="red"size="3"width="50%"align="left/center">
<p>XXXXXXXX</p>段落：通过标签 <p> 来定义，自动换行
<p>这是一个段落。</p>
<p>这是另外一个段落。</p>换行：通过标签 <br> 来定义，单标签
<p>
XXXXXX<br>XXXXXXX
</p>列表：无序列表<ul>，圆点开头
<ul type="XXX"><li>周杰伦</li><li>林俊杰</li><li>陈奕迅</li>
</ul>有序列表<ol> ，数字/罗马字母开头
层：<div>块级元素，默认全部宽度，高度有多少占多少，属性：width，height,align
<div style="width=100px;height:100px">XXXXX</div>块：<span>行内元素（不会自动换行，不存在宽高）
<span>XXXX</span>超链接： 通过标签 <a> 来定义
属性：href连接要跳转的位置 target窗口打开的位置：_self当前窗口 _blank空白窗口
<a href="">哔哩哔哩动画弹幕网站</a><base> 标签描述了基本的链接地址/链接目标，该标签作为HTML文档中所有的链接标签的默认链接:
<head>
<base href="/" target="_blank">
</head>锚点： 通过标签 <a> 来定义
href后跟#表示刷新当前页面，可以回到顶部
<a href="#">回到顶部</a>跳转到id/name位置
<a href="#id/nameXXXX"XXXXXX</a>图像： 通过标签 <img> 来定义，单标签
属性：src 引入图片的地址（必须属性）
alt 当图片破损或不存在时，显示的文本内容
titile 当鼠标悬停在图片上时显示的文本
width：图片的宽
height：图片的高
border：图片的边框
<img src="/images/logo.png" width="258" height="39" />表格： 通过<table>标签来定义
tr 行
td 标准单元格
th 表头（字体居中 加粗等效果）
table属性：width表格宽度
weight表格高度
border表格边界
align表格对齐方式
style="border-collapse:collapse;"合并表格的边框
tr属性：align行内容的对齐方式
bgcolor行背景颜色
<table width="400px"align="center"border="1"style="border-collapse:collapse;"><tr align="center"><th>编号</th><th>姓名</th><th>年龄</th></tr><tr><td>1</td><td>小明</td><td>20</td></tr><tr><td>2</td><td>小红</td><td>18</td></tr><tr><td>3</td><td>小蓝</td><td>21</td></tr></table>文档与外部资源关系： 通过<link> 标签定义
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>元数据: 通过 <meta>标签描述一些基本的元数据，元数据也不显示在页面上，但会被浏览器解析，通常用于指定网页的描述，关键词，文件的最后修改时间，作者，和其他元数据。<meta> 一般放置于 <head> 区域。
为搜索引擎定义关键词:
<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">
为网页定义描述内容:
<meta name="description" content="免费 Web & 编程 教程">
定义网页作者:
<meta name="author" content="Runoob">
每30秒钟刷新当前页面:
<meta http-equiv="refresh" content="30">脚本： <script>标签用于加载脚本文件
HTML注释：
<!-- 这是一个注释 -->格式化标签：
<font>：规定文本的字体、尺寸、颜色 face、size、color
<pre>：定义预格式化的文本（保留空格与换行）
<pre> Hello World </pre>
Hello World
 空格符<b>:加粗
<i>:倾斜
<u>:下划线
<del>:中划线
<sup>:上标
<sub>:下标
空元素：没有内容的 HTML 元素，未来版本中要求元素必须关闭，所以<XXX/>最保险
网页结构：
//图片来自菜鸟教程HTML 简介 | 菜鸟教程 (runoob)
更多推荐
网页前端培训1HTML/基础标签
发布评论