1.格式标记

<br/>    强制换行标记

<p>    换段落标记

换段落,由于多个空格和回车在HTML中会被等效为一个空格,所以HTML中要换段落就要用<p>,<p>段落中也可以包含<p>段落!

<center>  居中对齐标记

<pre>    预格式化标记

保留预先编排好的格式

<li>      列表项目标记

每个列表使用一个<li>标记

<ul>      无序列表标记

<ol>      有序列表标记   

可以显示特定的一些顺序:

(1)格式:

<ol type="符号类型">

  <li type="符号类型"></li>

  <li type="符号类型"></li>

</ol>

(2)有序列表的type属性值:1(默认属性值,阿拉伯数字1,2,3),A(大小写字母A、B、C),a(小写字母),Ι(大写罗马数字),i(小写罗马数字)

(3)value:指定一个新的序列数字起始值

(4)列表可以进行嵌套

<dl><dt><dd>    定义型列表

使用场合:对列表条目进行简短的说明

格式:

 <dl>
<dt>南邮介绍:</dt>
<dd>是一所双一流大学</dd>
<dt>北邮:</dt>
<dd>是一所211大学</dd>
6 </dl>

<hr>    水平分割线标记

段落之间的分割线

<div>    分区显示标记(层标记)

常用来编排一大段的HTML段落,也可以用于格式化表,和<p>很相似

曾可以多层嵌套使用

代码示例:

 <html>
<head>
<title>第三节课</title>
<meta charset="UTF-8">
</head>
<body> <!--***************1.强制换行****************-->
南京邮电大学!<br/>非常牛逼的一所高校。
<!--********************************************--> <!--***************2.换段落******************-->
<p>
南京邮电大学!非常牛逼的一所高校。南京邮电大学!非常牛逼的一所高校。南京邮电大学!非常牛逼的一所高校。南京邮电大学!非常牛逼的一所高校。南京邮电大学!非常牛逼的一所高校。南京邮电大学!非常牛逼的一所高校。南京邮电大学!非常牛逼的一所高校。南京邮电大学!非常牛逼的一所高校。
</p> <p>
南京邮电大学!非常牛逼的一所高校。南京邮电大学!非常牛逼的一所高校。南京邮电大学!非常牛逼的一所高校。南京邮电大学!非常牛逼的一所高校。南京邮电大学!非常牛逼的一所高校。南京邮电大学!非常牛逼的一所高校。南京邮电大学!非常牛逼的一所高校。南京邮电大学!非常牛逼的一所高校。
</p> <p>
<p>12394723423</p>
<p>ahadsafskfjsdlkf</p>
</p>
<!--********************************************--> <!--***************3.居中对齐*******************-->
<center>南京邮电大学!非常牛逼的一所高校。</center> <!--***************4.预格式化*******************-->
<p>南京邮电大学! 非常牛逼的一所高校。</p>
<p><pre>南京邮电大学! 非常牛逼的一所高校。</pre></p>
<!--********************************************--> <!--****************5.列表项目******************-->
<li>第一节课</li>
<li>第二节课</li>
<li>第三节课</li>
<li>第四节课</li>
<li>第五节课</li>
<!--********************************************--> <!--*****************6.无序列表******************-->
<ul>
<li>第一节课</li>
<li>第二节课</li>
<li>第三节课</li>
<li>第四节课</li>
<li>第五节课</li>
</ul>
<!--********************************************--> <!--*****************7.有序列表*****************--> <!--(1)最基础的有序列表-->
<!--<ol>-->
<!--<li>第一节课</li>-->
<!--<li>第二节课</li>-->
<!--<li>第三节课</li>-->
<!--<li>第四节课</li>-->
<!--<li>第五节课</li>-->
<!--</ol>--> <!--(2)设置type属性值-->
<!--<ol type="I">-->
<!--<li>第一节课</li>-->
<!--<li>第二节课</li>-->
<!--<li>第三节课</li>-->
<!--<li>第四节课</li>-->
<!--<li>第五节课</li>-->
<!--</ol>--> <!--(3)设置value属性值-->
<!--<ol type="1">-->
<!--<li>第一节课</li>-->
<!--<li value="5">第二节课</li>-->
<!--<li>第三节课</li>-->
<!--<li>第四节课</li>-->
<!--<li>第五节课</li>-->
<!--</ol>--> <!--(4)有序嵌套列表-->
<ol type="A">
<li>A选项
<ol type="1">
<li>第一节课</li>
<li>第二节课</li>
<li>第三节课</li>
<li>第四节课</li>
<li>第五节课</li>
</ol>
</li>
<li>B选项
<ol type="1">
<li>第一节课</li>
<li>第二节课</li>
<li>第三节课</li>
<li>第四节课</li>
<li>第五节课</li>
</ol>
</li>
<li>第三节课</li>
<li>第四节课</li>
<li>第五节课</li>
</ol> <!--*****************8.定义型列表******************-->
<dl>
<dt>南邮介绍:</dt>
<dd>是一所双一流大学</dd>
<dt>北邮:</dt>
<dd>是一所211大学</dd>
</dl>
<!--********************************************--> <!--******************9.水平分割线***************-->
南京邮电大学!非常牛逼的一所高校。
<hr>
南京邮电大学!非常牛逼的一所高校。
<!--********************************************--> <!--******************10.分区显示(层标记)*************-->
<div>
南京邮电大学!非常牛逼的一所高校。
<hr>
南京邮电大学!非常牛逼的一所高校。
</div>
<div>
南京邮电大学!非常牛逼的一所高校。
<hr>
南京邮电大学!非常牛逼的一所高校。
</div>
<!--********************************************-->
</body>
</html>

效果展示:

2.文本标记

<hn>    标题标记

共有6个级别,n的范围1~6,不同界别对应显示大小不同的标题,h1最大,h6最小

<font>    字体设置标记

设置字体的格式有三个常用的属性:

(1)size:   <font size="3">   取值范围是1~7,浏览器默认是3,XHTML 1.0中不支持size属性

(2)color: <font color="red">

(3)face(字体): <font face="微软雅黑">(默认)

<b>    粗字体标记

<i>    斜字体标记

<sub>    文字下标字体标记

<sup>    文字上标字体标记

<tt>    打印机字体标记

<cite>    引用方式的字体,通常显示为斜体字

<em>    表示强调,通常显示为斜体字

<strong>    表示强调,通常显示为粗体字

<small>    小型字体标记

<big>    大型字体标记

<u>    下划线字体标记

代码示例:

 <html>
<head>
<title>第四节课</title>
<meta charset="UTF-8">
</head>
<body>
<!--=============1.标题标记===============-->
南邮
<h1>南邮</h1>
<!--<h2>南邮</h2>-->
<!--<h3>南邮</h3>-->
<!--<h4>南邮</h4>-->
<!--<h5>南邮</h5>-->
<!--<h6>南邮</h6>-->
<!--======================================--> <!--==============2.字体标记==============-->
南京邮电大学
<font size="1">南京邮电大学</font>
<font size="5">南京邮电大学</font>
<font size="5" color="red">南京邮电大学</font>
<font size="5" color="red" face="楷体">南京邮电大学</font>
<!--======================================--> <!--===============3.粗字体标记==============-->
<br/>南邮
<b>南邮</b>
<!--======================================--> <!--================4.斜字体标记==========-->
<br/>南邮
<i>南邮</i>
<!--======================================--> <!--================5.文字上下标字体标记==========-->
<br/>
a<sup>2</sup>
a<sub>2</sub>
<!--======================================--> <!--================6.打印机字体字体标记====-->
<br/>123456789
<tt>123456789</tt>
<!--======================================--> <!--================7.引用方式的字体,通常是斜体===-->
<br/>莎士比亚
<cite>莎士比亚</cite>
<!--======================================--> <!--================8.表示强调,通常显示为斜体===========-->
<br/>莎士比亚
<em>莎士比亚</em>
<!--======================================--> <!--=================9.表示强调,通常显示为斜体=====================-->
<br/>莎士比亚
<strong>莎士比亚</strong>
<!--======================================--> <!--==================10.小型字体标记====================-->
<br/>
<font size="6">南邮</font>
<small>南邮</small>
<small><small>南邮</small></small>
<small><small><small>南邮</small></small></small>
<!--======================================--> <!--==================11.大型字体标记====================-->
<br/>
<big>ABC</big>
<big><big>ABC</big></big>
<big><big><big>ABC</big></big></big>
<!--======================================--> <!--===================12.下划线字体标记===================-->
<br/>ABC
<u>ABC</u>
<!--======================================--> </body>
</html>

效果展示:

HTML的文档设置标记的更多相关文章

  1. html的文档设置标记上(格式标记)4-5

    <html> <head> <title>第四课的标题及第五课的标题</title> <meta charset="utf-8" ...

  2. HTML文档设置标记

    格式标记 1.<br> 强制换行标记,让后面的文字.图片.表格等,显示在下一行.单标记 2.<p> 换段落标记,换段落是由于多个空格和回车在HTML中会被等效为一个空格,所以H ...

  3. [HTML/HTML5]1 HTML文档设置

    1.1  创建HTML文件 本质上,HTML文件就是具有下列两个特征的简单文本文件: HTML文件的扩展名为.html或者.htm.文件扩展名是一个缩写,它可将文件正确地关联到需要访问它的程序或工具. ...

  4. Springlake-02 权限&文档设置&Role设置&Folder设置&登录

    1. 权限 有3个默认的权限用户: 1.System Owner so 管理员权限全部:Type Setup; Group Setup; Form Setup; Role Setup; Share R ...

  5. C#中的XML文档注释-推荐的文档注释标记

    文档注释是为了方便自己和他人更好地理解代码所实现的功能.下面记录了一些常用的文档注释标记: <C> 用法: <c>text</c> 将说明中的文本标记为代码.例如: ...

  6. C# 给PDF文档设置过期时间

    我们可以给一些重要文档或者临时文件设置过期时间和过期信息提示来提醒读者或管理者文档的时效性,并及时对文档进行调整.更新等.下面,分享通过C#程序代码来给PDF文档设置过期时间的方法. 引入dll程序集 ...

  7. IT兄弟连 HTML5教程 HTML文档主体标记body

    在HTML的<body>和</body>标记中定义文档的主体,包含文档的所有内容(比如文本.超链接.图像.表格和列表等等).<body>标签有自己的属性,设置< ...

  8. netcore webapi帮助文档设置

    如何建 .netcore webapi 项目这个就不说了,这个都没有没必要看下去. 我这里是.netcore 2.0,虽然没测过1.0的,但想来差不多. 1.Nuget Packages安装,使用程序 ...

  9. office2007word文档设置多级目录

    office本来不是很难,关键就是经验吧,直入主题. 文档结构图设置了四级,但是目录始终只显示三级,郁闷了好久,网上看的也不靠谱,方法如下: 引用-目录-插入目录 弹出插入目录设置后,修改级别为最大, ...

随机推荐

  1. jmeter请求参数的两种方式

    Jmeter做接口测试,Body与Parameters的选取 1.普通的post请求和上传接口,选择Parameters. 2.json和xml请求接口,选择Body. 注意: 在做接口测试时注意下请 ...

  2. PostgreSQL内核学习笔记四(SQL引擎)

    PostgreSQL实现了SQL Standard2011的大部分内容,SQL处理是数据库中非常复杂的一部分内容. 本文简要介绍了SQL处理的相关内容. 简要介绍 SQL文的处理分为以下几个部分: P ...

  3. bootstrap234的ie兼容选择

    如果你需要兼容IE8甚至是IE7和IE6,那么只能选择Bootstrap2,虽然它自身在IE6的效果也并不完美.如果需要兼容IE678的话用2.如果需要高版本的浏览器,并且移动端优先的话,那么用boo ...

  4. SecureCRT 按退格键出现 ^H 的解决办法  

    问题如图 打开SecureCRT 界面,最上方工具栏 1.选项→会话选项 2.终端→仿真→映射键 3.其他选项→勾选 Backspace 发送 delete(B) 4.点击确定即可 另外在不可编辑状态 ...

  5. Yarn报错:Exception message: /bin/bash: line 0: fg: no job control

    Exception message: /bin/bash: line 0: fg: no job control 这个错误是 本地idea跨平台远程调试hadoop集群出现的,在使用windows调用 ...

  6. 《趣谈 Linux 操作系统》学习笔记(二):对 Linux 操作系统的理解

    首先,我们知道操作系统是管理和控制计算机硬件与软件资源的计算机程序.这里把操作系统想象为一个软件外包公司,其内核就相当于这家外包公司的老板,那么我们可以把自己的角色切换成这家外包公司的老板,设身处地的 ...

  7. linux笔记-硬件命令【2】

    1- 磁盘 1.1- 查看电脑磁盘类型 cat /sys/block/sda/queue/rotational 0 #固态盘 cat /sys/block/sdb/queue/rotational 1 ...

  8. IO流学习之字符流(三)

    IO流之字符流缓冲区: 概念: 流中的缓冲区:是先把程序需要操作的数据保存在内存中,然后我们的程序读写数据的时候,不直接和持久设备之间交互,而改成和内存中的数据进行交互. 缓冲区:它就是临时存储数据, ...

  9. json转dataset的另外一种解析方式自动生成guid强关联

    /// <summary> /// 将json字符串自动转成dataset,并且自动补全主子关联关系, /// Guid,FKGuid /// Author:lijia /// date: ...

  10. Python中io的open()在PyCharm环境下报错和路劲的问题

    PS:我也是初学者,上班空闲时间学习学习Python.今天学到io的时候,遇到了两个用PyCharm环境编写代码的小白错误,如下: 两个问题都是如下代码: 1. 第一个问题:当写好代码之后,点击运行报 ...