1. HTML 的基本结构

2. HTML 控制标记的格式

3. 最常用的控制标记

本章讲解最基本的 HTML 元素，也就是创建文档结构所需的元素。例如：标题、段落、

页面分隔、注释等等。

2.1 HTML 的基本结构

<html> -------根控制标记

<head> -------头控制标记

<title>标题</title> -------标题标记

</head> -------头控制标记（尾）

<body>

-------网页显示区域

</body>

</html> -------根控制标记(尾)

(1).<html>…</html>根控制标记

开头和结尾成对出现，双标签

(2).<head>…</head>头控制标记

1.<title>很单纯的文件标题声明

2.<meta>控制标记的动态文件转换声明

3.<base>超链接网址基准参考点

4.Javascript 和 VBScript 程序

5.stylesheet 可用来设置排版来的声明

6.<link>可引用外部文件，如 CSS 排版样本

(3).<title>…</title>设置浏览器的视窗标题

(4).<body>…</body>页面可见内容

2.2 HTML 控制标记的格式

(1).<标记名称>

单一型,无设置值的。

如：<br>

(2).<标记名称 属性=”属性值”>

单一型，有设置值的。

如：<hr width=”80%”>

(3).<标记名称>…</标记名称>

对称型，无设置值。

如：<title>…</title>

(4).<标记名称 属性=”属性值”>…</标记名称>

对称型，有设置值。

如：<body bgcolor=”red”>…</body>

<font size= ”7”>…</font>

2.3 最常用的控制标记

(1).跳行 <br>

格式：<br>

无属性设置

(2).段落 <p>

格式：<p align=”排列方式”>…</p>

属性名称 属性值 说明

align left 往左靠（默认）

center 往中靠

right 往右靠

(3).水平直线 <hr>

格式：<hr>

属性名称 属性值 说明

size 像素 绝对设置，以数字表示，属性值越大，线越粗

百分比 相对设置，以%表示，属性值越大，线越粗

width 像素 绝对设置，长度不会应视窗的改变而改变

百分比 相对设置，长度会随着视窗宽度而改变

noshade 实体线

(4).向中对齐 <center> (被废弃的标签)

格式：<center>…</center>

(5).背景色与文字设置

格式：<body bgcolor=”背景色” text=”文字颜色”>

整体页面的边距，行距

<body leftmargin=”像素” topmargin=”像素”>

(6).标题文字设置

格式：<h1>…</h1>

<h2>…</h2>

<h3>…</h3>

<h4>…</h4>

<h5>…</h5>

<h6>…</h6>

属性名称 属性值 说明

align left 靠左

center 靠中

right 靠右

(7).特殊字符设置

格式：< lt;

> gt;

& amp;

“ quot;

(8).在 HTML 备注

格式：<!--…-->

(9).实体字符控制标记

1.<b>…</b> 粗

2.<i>…</i> 斜

3.<s>…</s> 删

4.<u>…</u> 下划

5.<tt>…</tt> 电报

6.<sub>…</sub> 下标

7.<sup>…</sup> 上标

(10).语意字符控制

1.<address>…</address> 地址

2.<big>…</big> 大字

3.<del>…</del> 删除

4.<ins>...</ins> 修改

5.<samll>…</small> 小字

6.<strong>…</strong> 加强语气(加粗)

7.<em>...</em> 加强语气(倾斜)

(11).<font>字体控制 (被废弃的标签)

格式：<font>…</font>

属性名称 属性值 说明

size 0-7 字体大小

color 英文或十六 颜色

face 字体 字体

(12).格式化

格式：<pre>…</pre>

让书写的文字格式化！

(13).引用文本

格式：<blockquote>...</blockquote>

属性名称 属性值 说明

cite url 被引用的地址

2; HTML 基本结构的更多相关文章

  1. 【.net 深呼吸】细说CodeDom（1）：结构大观

    CodeDom 是啥东东?Html Dom听过吧,XML Dom听过吧.DOM一般可翻译为 文档对象模型,那 Code + DOM呢,自然是指代码文档模型了.如果你从来没接触过 CodeDom,你大概 ...

  2. 读书笔记：《HTML5开发手册》--HTML5新的结构元素

    读书笔记:<HTML5开发手册> (HTML5 Developer's CookBook) 虽然从事前端开发已有很长一段时间,对HTML5标签也有使用,但在语义化上面理解还不够清晰.之前在 ...

  3. Python学习--04条件控制与循环结构

    Python学习--04条件控制与循环结构 条件控制 在Python程序中,用if语句实现条件控制. 语法格式: if <条件判断1>: <执行1> elif <条件判断 ...

  4. HTML5 语义元素(一)页面结构

    本篇主要介绍HTML5增加的语义元素中关于页面结构方面的,包含: <article>.<aside>.<figure>.<figcaption>.< ...

  5. React在开发中的常用结构以及功能详解

    一.React什么算法,什么虚拟DOM,什么核心内容网上一大堆,请自行google. 但是能把算法说清楚,虚拟DOM说清楚的聊聊无几.对开发又没卵用,还不如来点干货看看咋用. 二.结构如下: impo ...

  6. ElasticSearch 5学习(10)——结构化查询（包括新特性）

    之前我们所有的查询都属于命令行查询,但是不利于复杂的查询,而且一般在项目开发中不使用命令行查询方式,只有在调试测试时使用简单命令行查询,但是,如果想要善用搜索,我们必须使用请求体查询(request ...

  7. ASP.NET Core应用针对静态文件请求的处理[4]: DirectoryBrowserMiddleware中间件如何呈现目录结构

    和StaticFileMiddleware中间件一样,DirectoryBrowserMiddleware中间本质上还是定义了一个请求地址与某个物理目录之间的映射关系,而目标目录体现为一个FilePr ...

  8. Go结构体实现类似成员函数机制

    Go语言结构体成员能否是函数,从而实现类似类的成员函数的机制呢?答案是肯定的. package main import "fmt" type stru struct { testf ...

  9. CRL快速开发框架系列教程十(导出对象结构)

    本系列目录 CRL快速开发框架系列教程一(Code First数据表不需再关心) CRL快速开发框架系列教程二(基于Lambda表达式查询) CRL快速开发框架系列教程三(更新数据) CRL快速开发框 ...

  10. Javacript实现字典结构

    字典是一种用[键,值]形式存储元素的数据结构.也称作映射,ECMAScript6中,原生用Map实现了字典结构. 下面代码是尝试用JS的Object对象来模拟实现一个字典结构. <script& ...

随机推荐

  1. 【sql注入教程】SQL注入是什么？我们如何去玩转它

    [sql注入教程]SQL注入是什么?我们如何去玩转它 本文转自:i春秋社区   SQL注入攻击是黑客攻击数据库最常见手段之一.简单讲,SQL注入攻击是黑客利用网站程序漏洞,通过提交精心构造的SQL语句 ...

  2. 2个简单实例让你快速理解try-catch的用法

    相信在实际项目中,你可能经常会看到类似下面的代码 try { // 尝试执行代码块 } catch(err) { // 捕获错误的代码块 } finally { // 结果如何都会执行的代码块 } 简 ...

  3. 一篇文章读懂HTTPS及其背后的加密原理

    HTTPS(全称: Hypertext Transfer Protocol Secure,超文本传输安全协议),是以安全为目标的HTTP通道,简单讲是HTTP的安全版.本文,就来深入介绍下其原理. 1 ...

  4. HTML_CSS笔记

    常用标记 水平标记:<hr/> 换行标记:<br/> 段落标记:<p></p> 标题标记:<h1></h1>~~<h6&g ...

  5. 向github提交代码不用输入帐号密码

    解决方案:方案一: 在你的用户目录下新建一个文本文件.git-credentials Windows:C:/Users/username Mac OS X: /Users/username Linux ...

  6. 机器学习入门09 - 特征组合 (Feature Crosses)

    原文链接:https://developers.google.com/machine-learning/crash-course/feature-crosses/ 特征组合是指两个或多个特征相乘形成的 ...

  7. [Objective-C语言教程]数组（14）

    Objective-C编程语言提供了一种叫作数组的数据结构,它可以存储相同类型的固定大小顺序元素的集合.数组用于存储数据集合,但将数组视为相同类型的变量集合通常更有用. 可以声明一个数组变量(例如nu ...

  8. 【Spark调优】Kryo序列化

    [Java序列化与反序列化] Java序列化是指把Java对象转换为字节序列的过程:而Java反序列化是指把字节序列恢复为Java对象的过程.序列化使用场景:1.数据的持久化,通过序列化可以把数据永久 ...

  9. app测试之专项测试

    专项测试包含很多东西,安装.升级.卸载.性能.安全.网络.随机等等,这些都属于专项测试 一个app的正常到用户手里使用,功能是最基础的测试,专项测试测试主要的. 下面介绍一些常用的专项测试: 1.多任 ...

  10. php5.5+apache2.4+mysql5.7在windows下的配置

    apache2.4下载和安装 下载apache2.4 https://www.apachelounge.com/download/VC11/ 提取解压目录Apache24到d:/dev/Apache2 ...