标题图
前端开发基础教程 - html 教程
HTML 是超文本标签语言, 又可以说是超文本标记语言, 是基本功. HTML 发展历史跳过.
HTML 结构一般有 < head > 标签,<body > 标签, 网页的头部和内容, HTML 的头部页面有标题, 关键词, 描述说明, 不作内容来显示, 但影响网页效果.
问: HTML 是什么?
HTML 是一种超文本标签语言, 又是一种超文本标记语言, 是基本功.
问: HTML 一般结构是?
一般有 < head > 标签,<body > 标签, 为网页头部和网页内容.
问: 头部标签具有什么?
头部标签有网页的标题, 关键词, 描述内如.
作用: 不具备显示, 但可以影响网页显示效果.
问:<body > 是什么?
是用来显示实际效果内容的.
问: HTML 注解格式?
<!-- 注释内容 -->
HTML 案例:
- <!DOCTYPE HTML>
- <HTML>
- <body>
- <h1>
- 标题
- </h1>
- <p>
- 段落
- </p>
- </body>
- </HTML>
DOCTYPE 用来声明文档类型
- <HTML>
- 标签为 HTML 网页的根元素
- <head>
- 标签为文档头部文件
- <title>
- 标签为文档的标题
- <body>
- 标签为文档的主题
- <h1>
- 标签为标题
- <p>
- 标签为段落显示
问: 什么是 HTML?
HTML 是超文本标记语言, 它是使用一套标记标签的语言用来描述网页的, HTML 文档可以说是 web 网页.
- <!DOCTYPE HTML>
- <HTML>
- <head>
- <meta charset="UTF-8">
- <title>
- 网页标题
- </title>
- </head>
- <body>
- <h1>
- 标题
- </h1>
- <p>
- 段落
- </p>
- </body>
- </HTML>
- <!DOCTYPE HTML>
- <HTML>
- <head>
- <meta charset="utf-8">
- <title>
- 标题
- </title>
- </head>
- <body>
- <h1>
- 标题
- </h1>
- </body>
- </HTML>
- <!DOCTYPE HTML>
- <HTML>
- <head>
- <meta charset="utf-8">
- <title>
- 标题
- </title>
- </head>
- <body>
- <h1>
- 这是标题 1
- </h1>
- <h2>
- 这是标题 2
- </h2>
- <h3>
- 这是标题 3
- </h3>
- <h4>
- 这是标题 4
- </h4>
- <h5>
- 这是标题 5
- </h5>
- <h6>
- 这是标题 6
- </h6>
- </body>
- </HTML>
- <p>
- 段落
- </p>
- <p>
- 段落
- </p>
- <!DOCTYPE HTML>
- <HTML>
- <body>
- <p>
- 段落
- </p>
- </body>
- </HTML>
- <body>
- 元素定义了 HTML 文档的主体
- <HTML>
- 元素定义了整个 HTML 文档
- <p>
- 段落
- </p>
- <hr>
- <p>
- 段落
- </p>
- <!-- 这是一个注释 -->
- <p>
- 定义段落
- <br/>
- 换行
- <b>
- 定义粗体
- <i>
- 定义斜体
- <em>
- 定义重文字
- <small>
- 定义小号字体
- <strong>
- 定义加重语气
- <sub>
- 定义下标字
- <sup>
- 定义上标字
- <ins>
- 定义插入字, 下划线
- <del>
- 定义删除字
- <code>
- 定义计算机代码
- <kbd>
- 定义键盘码
- <samp>
- 定义计算机代码样本
- <var>
- 定义变量
- <pre>
- 定义预格式文本
- <abbr>
- 定义缩写
- <address>
- 定义地址
- <bdo>
- 定义文字方向
- <blockquote>
- 定义长的引用
- <q>
- 定义短的引用语
- <a href="#">
- 文字
- </a>
- <a href="#" target="_blank">
- </a>
- <base>
- 标签描述了基本链接地址, 蒂尼了所有链接标签的默认链接
- <head>
- <base href="#" target="_blank">
- </head>
- <head>
- <link rel="stylesheet" type="text/CSS" href="mystyle.css">
- </head>
- <head>
- <style type="text/css">
- body {background-color:yellow} p {color:blue}
- </style>
- </head>
- <meta http-equiv="refresh" content="30">
- CSS p {color:red;text-align:center;} text-align:center; .center {text-align:center;}
- // 外部样式表
- <head>
- <link rel="stylesheet" type="text/css" href="mystyle.css">
- </head>
- // 内部样式表
- <head>
- <style>
- p {margin-left:40px;}
- </style>
- </head>
来源: http://www.jianshu.com/p/66249e036c8b