HTML的文档设置标记
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的文档设置标记的更多相关文章
- html的文档设置标记上(格式标记)4-5
<html> <head> <title>第四课的标题及第五课的标题</title> <meta charset="utf-8" ...
- HTML文档设置标记
格式标记 1.<br> 强制换行标记,让后面的文字.图片.表格等,显示在下一行.单标记 2.<p> 换段落标记,换段落是由于多个空格和回车在HTML中会被等效为一个空格,所以H ...
- [HTML/HTML5]1 HTML文档设置
1.1 创建HTML文件 本质上,HTML文件就是具有下列两个特征的简单文本文件: HTML文件的扩展名为.html或者.htm.文件扩展名是一个缩写,它可将文件正确地关联到需要访问它的程序或工具. ...
- Springlake-02 权限&文档设置&Role设置&Folder设置&登录
1. 权限 有3个默认的权限用户: 1.System Owner so 管理员权限全部:Type Setup; Group Setup; Form Setup; Role Setup; Share R ...
- C#中的XML文档注释-推荐的文档注释标记
文档注释是为了方便自己和他人更好地理解代码所实现的功能.下面记录了一些常用的文档注释标记: <C> 用法: <c>text</c> 将说明中的文本标记为代码.例如: ...
- C# 给PDF文档设置过期时间
我们可以给一些重要文档或者临时文件设置过期时间和过期信息提示来提醒读者或管理者文档的时效性,并及时对文档进行调整.更新等.下面,分享通过C#程序代码来给PDF文档设置过期时间的方法. 引入dll程序集 ...
- IT兄弟连 HTML5教程 HTML文档主体标记body
在HTML的<body>和</body>标记中定义文档的主体,包含文档的所有内容(比如文本.超链接.图像.表格和列表等等).<body>标签有自己的属性,设置< ...
- netcore webapi帮助文档设置
如何建 .netcore webapi 项目这个就不说了,这个都没有没必要看下去. 我这里是.netcore 2.0,虽然没测过1.0的,但想来差不多. 1.Nuget Packages安装,使用程序 ...
- office2007word文档设置多级目录
office本来不是很难,关键就是经验吧,直入主题. 文档结构图设置了四级,但是目录始终只显示三级,郁闷了好久,网上看的也不靠谱,方法如下: 引用-目录-插入目录 弹出插入目录设置后,修改级别为最大, ...
随机推荐
- java基础--------arraylist(动态数组)和linkedlist(双向链表)的区别
arraylist使用数组存储数据,所以这样存储的数据根据索引查询的数据速度快,但是新增或者删除元素时需要设计到位移操作,所以比较慢. linkedlist使用双向链表方式存储数据,每个元素都记录前后 ...
- Django复制记录的方法
最近的Django项目中有复制记录的需求.数据库里有一张名为Party的表,记录用户创建的party,现在要让用户能够复制一个新的party.本身非常简单的一个功能,但运行的时候出错了.我以为是复制过 ...
- R语言入门:向量初探
R语言主要用于统计,因此引入了向量这个概念将更好地进行统计计算,在其他无法引入向量的语言当中则会使用循环来计算一些大规模的数据,在R语言当中则不需要,下面我们来看看R语言当中向量的具体用法吧! 首先, ...
- java设计模式学习笔记--接口隔离原则
接口隔离原则简述 客户端不应该依赖它不需要的接口,即一个类对另一个类的依赖应建立在最小的接口上 应用场景 如下UML图 类A通过接口Interface1依赖类B,类C通过接口Interface1依赖类 ...
- Linux CURL的安装和使用
--获得安装包,从网上直接下载或者其他途径,这里直接wget# wget http://curl.haxx.se/download/curl-7.17.1.tar.gz--解压到当前目录# tar - ...
- demo Django-基础书籍添加删除(单表)
小demo使用---- 1.pycharm-2019.2 2.python-3.7.2 3.mysql-5.7.25 4.django-2.2.4 使用过程中的一些注意事项和出现的常见错误的解决地址 ...
- JS 数组常见操作汇总,数组去重、降维、排序、多数组合并实现思路整理
壹 ❀ 引 JavaScript开发中数组加工极为常见,其次在面试中被问及的概率也特别高,一直想整理一篇关于数组常见操作的文章,本文也算了却心愿了. 说在前面,文中的实现并非最佳,实现虽然有很多种,但 ...
- nginx配置location与rewrite规则教程
location 教程 location 教程 示例: location = / { # 精确匹配 / ,主机名后面不能带任何字符串 [ configuration A ] }location / { ...
- [[FJOI2016]神秘数][主席树]
明白之后 5min 就写好了-自闭- 这题的题意是问你 \([L,R]\) 区间的数字不能构成的数字的最小值- 首先考虑 如果 \([1,x]\) 可以被表示 那么加入一个 \(a_i\) 显然 \( ...
- 《操作系统真象还原》BIOS
以下是读本书第二章的收获. 记得我大学学习操作系统的时候会遇到一些奇奇怪怪的问题,因为觉得问题太奇怪了,所以羞于问老师.诸如ROM到底是个什么东西:如果用内存映射的方式访问外部设备,是不是内存条里专门 ...