二、基本标签

1.文件标签（结构）

<html>

根标签

    <head>

          <title>页面标题（标签）</title>

    </head>

    <body>

          页面所有内容

          包括：

          text=“文本颜色”

          bgcolor=“背景颜色”

          background=“背景图”

          颜色属性的拓展：

          1.单词：red，green，blue 2.rgb三原色：rgb（red，green，blue），rgb（0，0，0），值范围0-255 3.#000000（黑色），#FFFFFF（白色），#FF0000，值范围#000000-#FFFFFF

     </body>

</html>

2.排版标签

1）<!-- 注释标签 -->

2）换行标签<br/>

3）<p>段落标签：文本内容-文字</p>

        段与段之间会有空行

        对齐方式属性align=（三个属性值取其一）“left/center/right”

4）水平线<hr/>

        长width=""

        高size=""

        色color=""

        对齐属性align同上

        尺寸（长、高）的表示方法：1.百分百（随着页面大小变化而变化，占据百分比的比例） 2.像素（例如：100px）

3.文字标签

<font>

      基本文字标签

      属性：1.color颜色（属性值上面有说明） 2.face字体 3.size大小（max：7 min：1 default：3）

</font>

说到文字标签，可必须得拉上标题标签扯上一扯。

<h1>标题标签</h1>

    随着阿拉伯数字的增加字体随之减小，粗字体，大小是内置，默认占一行

 ......

<h6>标题标签</h6>

4.块标签

<div>

        行级块标签：占据一行

        用处：div+css

</div>

其他行级标签：p、ol、li、dl、dt、dd、h1~h6、form、ul

<span>

        行内块标签：占据一行内的一小块

        用处：设置提示、文字样式

</span>

 其他行内标签：a、strong、b、i、u、label、br、em

5.清单标签/列表标签

1)

<ul>无序列表</ul>

<li>

    列表项

    属性（type）=“disc/square/circle”

    disc：实心圆（默认）

    square:实心方块

    circle：空心圆

</li>

小例子：

<ul>

    <li>列表项</li>

</ul>

2)

<ol>有序列表</ol>

<li>

    列表项

    属性（type）=“数字/字母/罗马字”，start（首选项开始）=“数字”

</li>

小例子：

<ol>

<li>列表项</li>

</ol>

作用：实现菜单（横/纵）

去除小圆点：这是无序列表标签自带属性，在HTML中无法直接去除。方法：在CSS中的li标签添加list-style：none；

6.链接标签

<a>

    链接标签

    href=“跳转页面地址”

    name=“名字，锚点”

    锚点说明：锚点链接是网页制作中超链接的一种

    target=“_self（自己，默认） _blank（新页面打开，保留之前页面）”

    用途：1.页面跳转。如需跳转外网需要加协议（超文本传输协议）http：//。 2.访问锚点，跳转到：顶部/底部/中间。格式：#name=“值”

</a>

7.图片标签

<img  "图片标签/不需手动关闭"

    src：照片的位置

    alt：图片说明

    width=“1.百分比 2.像素”：宽

    height=“1.百分比 2.像素”：高 border=“1.百分比 2.像素”：框

    align=“top/middle/bottom/left/right”：对齐：图片和相邻文本的相对位置

/>

8.表格标签

重点：table、tr、td、th

<table>

    <caption>表格标题，默认居中，一个表格一个标题</caption>

    <thead>表格页眉，用于组合HTML表格的表头内容，页眉内部必须有tr标签</thead>

    <tbody>定义表格主体，用于组合HTML表格主体内容</tbody>

    <tfoot>页脚，用于组合HTML表格的表注内容</tfoot>

    thead、tbody、tfoot分块加载显示，由头到身体再到脚

    表格标签

    border=“1.百分比 2.像素”：框

    width=“1.百分比 2.像素”

    align对齐方式

    <tr>

        行，可有一个或多个th

        align表格行对齐，bgcolor背景色

        td和th皆为单元格：td表格单元格，包含数据。th表头单元格，包含表头。

        作用：表格样式、页面布局

        <td>

            align表格内容对齐、height、width、bgcolor

            colspan设定列合并，rowspan设定行合并

        </td>

        <th>

            定义表格的表头。默认居中加粗

        </th>

    </tr>

</table>

示例：

body的代码

`

	<hr align="center" size="10" width="50%" color="red"></hr>

	<p align="center">真<br/>漂亮！</p>

	<!-- 文字标签 -->

	<h1 align="center" >忆江南</h1>

	<font color="bule" size="2" face="宋体">白居易<br/></font>

	江南好，风景旧曾谙。日出江花红胜火，春来江水绿如蓝。能不忆江南？<br/>

	江南忆，最忆是杭州。山寺月中寻桂子，郡亭枕上看潮头。何日更重游？<br/>

	江南忆，其次忆吴宫。吴酒一杯春竹叶，吴娃双舞醉芙蓉。早晚复相逢？<br/>

	<h1>标题1</h1>

	<h2>标题2</h2>

	<h3>标题3</h3>

	<h4>标题4</h4>

	<h5>标题5</h5>

	<h6>标题6</h6>

	<!-- 块标签 -->

	<div style="background-color:red">贼厉害1</div>

	<span style="background-color:yellow">111</span>

	<span style="background-color:red">贼厉害2</span>

	<div style="background-color:red">贼厉害3</div>

	<!-- 列表标签 -->

		<!-- 无序,这里的缩进只是为了更好叙述，并无实际意义 -->

		<ul >

		<li type="square">列表1</li>

		<li type="circle">列表2</li>

		<li>列表4</li>

		</ul>

		<ul>

		<li type="circle">列表3</li>

		<li>列表4</li>

		</ul>

		<!-- 有序 -->

		<ol type="1" start="2">

		<li>清单1</li>

		<li>清单1</li>

		<li>清单1</li>

		<li>清单1</li>

		</ol>

		<ol type="I" start="2">

		<li>清单2</li>

		<li>清单2</li>

		<li>清单2</li>

		<li>清单2</li>

		</ol>

		<ol type="A" start="3">

		<li>清单3</li>

		<li>清单3</li>

		<li>清单3</li>

		<li>清单3</li>

		</ol>

		<ol type="a" start="4">

		<li>清单4</li>

		<li>清单4</li>

		<li>清单4</li>

		<li>清单4</li>

		</ol>

	<!-- 链接，第一个“基本”链接到我HTML1的小实验的网址了 -->

	<a href="basic.html" target="_blank"><br/>基本</a>

	<br/>

	<a href="pieceLabel.html">我还是我</a>

	<br/>

	<a href="#top">顶部</a><br/>

	<!-- 图片标签，图片取自网络，若有侵权，联系即删 -->

	<img src="../images/1.jpg" alt="mm" width="800" height="900" border="20%" align="top" />

	<br/>

	<!-- 表格 -->

	<table border="5" align="center" height="20%" width="10%" bgcolor="yellow">

	<caption>各专业收费</caption>

	<tr>

	<td>专业</td>

	<td>学费</td>

	<td>住宿费</td>

	</tr>

	<tr>

	<td>网络</td>

	<td>5xxx</td>

	<td>xxx</td>

	</tr>

	<tr>

	<td>自动化</td>

	<td>7xxx</td>

	<td>yyy</td>

	</tr>

	<tr>

	<td>会计</td>

	<td>8xxx</td>

	<td>jjj</td>

	</tr>

	</table>

`

图例：

注：未经同意请勿转载，仅作学习使用。以上有描述不正确之处，望大家能不吝指出，共同学习共同进步。谢谢

HTML超文本标记语言2的更多相关文章

  1. html 超文本标记语言

    1.html超文本标记语言 2.在html中存在着大量的标签,我们用html中存在的标签将要显示在网页的内容包含起来. 3.css 控制网页显示内容的效果. 4.html+css 只能是静态网页. 5 ...

  2. 超文本标记语言(HTML)

    超文本标记语言(HyperText MarkUp Language,HTML) HTML是用来制作网页的标记语言,HTML不需要编译,直接由浏览器解析: HTML文件是一个文本文件,包含了一些HTML ...

  3. HTML——超文本标记语言

    HTML: 网站(站点) - 网页 1.HTML作为文件后缀名,可以把文件变为网页 2.HTML是一门编程语言的名字:超文本标记语言 3.超越了文字的范畴,除了文字还可以有图片.视频.音频.动画特效等 ...

  4. html超文本标记语言的由来

    万维网上的一个超媒体文档称为一个页面:page,作为一个组织或者个人在万维网上放置开始点的页面称为主页:homepage或者首页,主页中通常有指向其他相关页面或者其他节点的指针,就是通常所说的超链接, ...

  5. HTML：Hyper Text Markup Language 超文本标记语言

    1.HTML是什么? *Hyper Text Markup Language 超文本标记语言 *Hyper Text:超链接.把不同空间的资源,整合在一起,形成逻辑上的网状结构. *Markup La ...

  6. 超文本标记语言HTML

    介绍html文档的基本结构,html常用标签的使用,理解html语言制作网页基本原理. html概述和基本结构 html概述 HTML是 HyperText Mark-up Language 的首字母 ...

  7. Html就是超文本标记语言的简写，是最基础的网页语言

    Html就是超文本标记语言的简写,是最基础的网页语言. Html是通过标签来定义的语言,代码都是由标签所组成. Html代码不用区分大小写. Html代码由<html>开始</htm ...

  8. html(HyperText Markup Language)--超文本标记语言

    1.html的简介? * 什么是html? ** HyperText Markup Language:超文本标记语言,网页语言 ** 超文本:超出文本的范畴,使用html可以轻松实现这样操作: ** ...

  9. HTML(超文本标记语言)的内容和理解

    由于上篇文章中提到WebMethod的Description 属性(propery)中可以使用超文本,因此就记录一篇关于超文本的文章以供参考,注意:Description=" HTML格式  ...

  10. 超文本标记语言(Hyper Text Markup Language)：构建网页的语言

    超文本标记语言(Hyper Text Markup Language):构建网页的语言

随机推荐

  1. 搭建SpringCloudAlibaba父工程

    1.首先创建一个maven项目 删除src目录,当做一级目录用来管理第三方jar版本控制. 2.配置pom文件. SpringCloud.SpringCloudAlibaba.SpringBoot版本 ...

  2. Java实现平衡二叉搜索树(AVL树)

    上一篇实现了二叉搜索树,本章对二叉搜索树进行改造使之成为平衡二叉搜索树(Balanced Binary Search Tree). 不平衡的二叉搜索树在极端情况下很容易退变成链表,与新增/删除/查找时 ...

  3. [数据库]MYSQL之授予/查验binlog权限

    在后端做主从备份:亦或是在大数据领域中,各类CDC同步(Canal / Flink CDC等),均会基于MYSQL的binlog来实现. 因此,知道需要哪些权限?怎么查验去.怎么授权就很重要了. 感觉 ...

  4. js数组和字符串方法

    一.数组方法 1.1.可以改变原数组 var arr = [10, 20, 30, 40, 50, 55]; // 1. **** push() --- 在数组的最后添加一项内容 // var ret ...

  5. 2022-07-05：给定一个数组，想随时查询任何范围上的最大值。 如果只是根据初始数组建立、并且以后没有修改， 那么RMQ方法比线段树方法好实现，时间复杂度O(N*logN)，额外空间复杂度O(N*

    2022-07-05:给定一个数组,想随时查询任何范围上的最大值. 如果只是根据初始数组建立.并且以后没有修改, 那么RMQ方法比线段树方法好实现,时间复杂度O(NlogN),额外空间复杂度O(Nlo ...

  6. 2020-12-31：tcp三次握手，最后一次失败，网络会怎么样？

    福哥答案2020-12-31:[答案来自此链接:](https://www.zhihu.com/question/437249958)第一次握手:建立连接时,客户端发送syn包(syn=a)到服务器, ...

  7. 2022-02-20：设计内存文件系统。 设计一个内存文件系统，模拟以下功能： ls： 以字符串的格式输入一个路径。如果它是一个文件的路径，那么函数返回一个列表，仅包含这个文件的名字。如果它是一个文件

    2022-02-20:设计内存文件系统. 设计一个内存文件系统,模拟以下功能: ls: 以字符串的格式输入一个路径.如果它是一个文件的路径,那么函数返回一个列表,仅包含这个文件的名字.如果它是一个文件 ...

  8. 2021-11-15：四数相加 II。给你四个整数数组 nums1、nums2、nums3 和 nums4 ，数组长度都是 n ，请你计算有多少个元组 (i, j, k, l) 能满足：0 ＜= i,

    2021-11-15:四数相加 II.给你四个整数数组 nums1.nums2.nums3 和 nums4 ,数组长度都是 n ,请你计算有多少个元组 (i, j, k, l) 能满足:0 <= ...

  9. 合合信息亮相CCIG2023：多位大咖共话智能文档未来，文档图像内容安全还面临哪些技术难题？

    ​ 近日,中国图象图形大会(CCIG 2023)(简称"大会")在苏州圆满落幕.本届大会以"图象图形·向未来"为主题,由中国科学技术协会指导,中国图象图形学学会 ...

  10. this关键字理解

    编译器对对象的加载步骤: (1)类名 (2)成员变量 (3)成员方法 即使定义类时,成员变量写在成员方法后面,加载对象时,也是先加载成员变量 当编译器识别方法时,会对成员方法改写,在所有方法里隐藏一个 ...