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本来不是很难,关键就是经验吧,直入主题. 文档结构图设置了四级,但是目录始终只显示三级,郁闷了好久,网上看的也不靠谱,方法如下: 引用-目录-插入目录 弹出插入目录设置后,修改级别为最大, ...
随机推荐
- em和rem区别
em大小依据父元素的字体大小的倍数 rem大小依据与根元素,即html标签的font-size大小
- 汇桔网被曝拖欠12月份工资至今,强制买产品,CEO称去年交易额超400亿
三言财经消息,近日有汇桔网员工爆料,汇桔网拖欠12月工资至今,通知延迟到4月才发放. 此外爆料还指出,"各种手法逼迫大家离开,员工要么继续忍受,要么主动离职,要么停薪留职.都不同意只能仲裁. ...
- 8maven配置多个项目之间的依赖
首先创建两个项目进行测试依赖 创建一个HelloWorld2项目,一个HelloWorld类里面有一个sayHello的方法 然后再创建一个HelloWorldTime项目,一个SayHelloWor ...
- KMP刷题记录
[BZOJ4698][SDOI2008]Sandy的卡片 差分一下然后选一个串,用这个串的所有前缀和其他串kmp,求出最长的公共部分即可 代码: #include <bits/stdc++.h& ...
- 【Pyecharts可视化分享】杭州步行热门路线等~
前言 本文包括内容如下: 杭州步行热门路线 渐变效果散点图 均是Echarts官方提供等示例,本文将会通过Pyecharts来进行实现. 杭州步行热门路线 因为代码中需要调用百度地图,所以开始之前你需 ...
- 【database】oracle关联查询主表对应的特定一行从表结果集
主表: 从表: 结果集: 查询从表中年龄最大的一行数据,如果存在年龄相等的则为了保证唯一取id(主键)最大的一行. 一.利用sql子查询嵌套 -- -------------------------- ...
- 航空航天专用Everspin非易失性MRAM存储器
TAMU是由瑞典乌普萨拉的Ångström航空航天公司(ÅAC)开发的高级磁力计子系统.TAMU的目的是提供地球磁场的磁力计数据,以便与子画面观测相关.实验性TAMU由使用领先技术制造的四种类型的设备 ...
- selenium webdriver执行远程 第三方js解决方案
今天一个朋友问我问题 考虑了下直接上代码,这是伪代码不能执行,但是给出了思路 代码 url = 'http://www.qingmiaokeji.cn/test.js' res = urllib.re ...
- 谷歌浏览器chrome应用商店无法打开的解决方法
解决办法:谷歌访问助手 谷歌访问助手是一款免费的谷歌服务代理插件,不用配置就可以正常访问谷歌的大部分服务,而且速度也很快.下载地址:http://www.cnplugins.com/advsearch ...
- VUE动画Javascript钩子不生效问题记录
举例小球动画如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...