当前位置: 首页 > news >正文

网页制作02-html,css,javascript初认识のhtml的文字与段落标记

用一首李白的将进酒,对文字与段落标记进行一个简单的介绍演示:

目录

一、标题字

1、标题字标记h

2、标题字对其属性align

二、文本基本标记

1、字体属性face

2、字号属性size

3、颜色属性 Color

三、文本格式化标记

1、粗体标记 b ,strong

2、斜体标记 i,em,cite

3、上标标记sup

4、下标标记sub

5、大字号标记big

6、小字号标记small

7、下划线标记u

四、段落标记

1、段落标记 P

2、换行标记br

3、不换行标记nobr

五、水平线

1、插入水平线hr

2、水平线宽度width

3、水平线高度size

4、水平线去掉阴影noshade

5、水平线颜色color

6、水平线排列align

六、其他标记

一般情况下特殊符号的代码组成为:&+字符名称+;   

下表为部分符号        :       

HTML 代码符号描述代码符号描述
&lt;<小于号&sect§分节符
&gt;>大于号&deg;°
&amp;&&#43;+
&quot;引号&#45;-
&reg;®已注册&#42;*
&trade;商标&divide÷
&copy;©版权标记&ensp;半个空白位
&yen;¥人民币&emsp;一个空白位
&euro;欧元&nbsp;不断行的空白位
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>将进酒</title>
</head>
<!--ā á ǎ à ō ó ǒ ò ī í ǐ ì ū ú ǔ ù ǖ ǘ ǚ ǜ ń ň-->
<body>
<h1 align="center">将进酒</h1><!--设置标题的级别, H1到h6-->
<h2 align="right">---李白</h2><!--align属性设置对齐方式-->
	
<p><font face="Aa剑豪体">君不见黄河之水天上来,奔流到海不复回。</font></p><!--face属性设置字体属性-->

<p><font face="华文隶书">君不见高堂明镜悲白发,朝如青丝暮成雪。</font></p>

<p><font size="+3">人生得意须尽欢,莫使金樽空对月。</font></p><!--从-4~正4的整数,是相对于3号放大和缩小的字号-->

<p><font size="4">天生我材必有用,千金散尽还复来。</font></p><!--size字体绝对大小属性,由1-7的整数组成-->

<p><font color="#7E00EF">烹羊宰牛且为乐,会须一饮三百杯。</font></p><!--color属性设置字体颜色-->

<p><b>岑夫子</b>,丹丘生,<strong>将进酒,杯莫停。</strong></p><!--粗体标记strong,b-->

<p>与君<i>歌一曲</i>,<em>请君</em>为我<cite>倾耳听。</cite></p><!--斜体标记i,em,cite-->

<ruby>
<p>钟鼓馔玉不足贵,<rt>zhōng gǔ zhuàn yù bù zǔ guì </rt>
	但<rt>dàn</rt>愿<rt>yuàn</rt>长<sup>cháng</sup>醉<sub>zuì</sub>不复醒。</p>
</ruby><!--sub( SuperScript),sub(subscript)-->
	
<p><big>古</big>
	<big><big>来</big></big>
	<big><big><big>圣</big></big></big>
	<big><big><big><big>贤</big></big></big></big>
	<big><big><big><big><big>皆</big></big></big></big></big>
	<big><big><big><big><big><big>寂</big></big></big></big></big></big>
	<big><big><big><big><big><big><big>寞</big></big></big></big></big></big></big>,
	<small>惟</small>
	<small><small>有</small></small>
	<small><small><small>饮</small></small></small>
	<small><small><small><small>者</small></small></small></small>
	<small><small><small><small><small>留</small></small></small></small></small>
	<small><small><small><small><small><small>其</small></small></small></small></small></small>
	<small><small><small><small><small><small><small>名</small></small></small></small></small></small></small>
</p>

<p><u>	陈王昔时宴平乐,斗酒十千恣欢谑。</u></p><!--下划线标记u,p用来起始一个段落-->

主人何为言少钱,<br>径须沽取对君酌。<br><!--br在不另起一段的情况下将当前文本强制换行,一个br为1行-->
<br>
五花马,千金裘,呼儿将出换美酒,<br>
	<br><br>
与尔同销万古愁。<br><br>
<hr><!--插入水平线hr-->默认水平线
<hr noshade>无阴影水平线
<hr color="#000000" align="left">黑色左对齐水平线
<hr width="500" size="3"><br><center>长度为500像素,高度3像素水平线</center>
<hr>
<nobr>01ā á ǎ à ō ó ǒ ò ī í ǐ ì ū ú ǔ ù ǖ ǘ ǚ ǜ ń ň ā á ǎ à ō ó ǒ ò ī í ǐ ì ū ú ǔ ù ǖ ǘ ǚ ǜ ń ň </nobr><!--nobr不换行标记--><br>02ā á ǎ à ō ó ǒ ò ī í ǐ ì ū ú ǔ ù ǖ ǘ ǚ ǜ ń ň
<hr>
特殊符号:<br>
	&#33;!<br>
	&#35;#<br>
	&#36;$<br>
	&#37;%<br>
	&#39;'<br>
	&#40;(<br>
	&#41;)<br>
	&#42;*<br>
	&#43;+<br>
	&#44;,<br>
	&#45;-<br>
	&#46;.<br>
	&#58;:<br>
	&#59;;<br>
	&#61;=<br>
	&#63;?<br>
	&#64;@<br>
	
</body>
</html>

代码演示结果: 

相关文章:

  • Audio-Visual Speech Enhancement(视听语音增强)领域近三年研究进展与国内团队及手机厂商动态分析
  • js闭包,跨域
  • Effective C++读书笔记——item49(了解new-handle的行为)
  • 深度学习:从技术突破到未来展望
  • Linux系统 -- 环境安装,xshell和多用户,基本的Linux指令和Linux的用处
  • OpenCV中的边缘检测
  • 从低清到4K的魔法:FlashVideo突破高分辨率视频生成计算瓶颈(港大港中文字节)
  • Tomcat如何处理Http请求
  • 白话概念模型、逻辑模型与物理模型
  • ubuntu 安装 Redis
  • Java和JavaScript当中的json对象和json字符串分别讲解
  • Weather Regimes(WRs)方法介绍
  • 股指期货是什么?股指期货日内拐点有什么特征?
  • 备战蓝桥杯:贪心算法之货仓选址
  • 存储引擎---数据库
  • spring的核心配置
  • 什么是DNS?DNS解析的过程是怎样的?
  • Zookeeper分布式锁实现
  • rust学习笔记1-window安装开发环境
  • 上线了一个微软工具(免费),我独自开发,本篇有源码
  • 首开股份:一季度净利润亏损约10.79亿元,签约金额63.9亿元
  • 国务院食安办:加强五一假期食品生产、销售、餐饮服务环节监管
  • 十四届全国人大常委会举行第四十四次委员长会议
  • 现场聆听总书记讲话,“00后”博士和大模型CEO都“热血沸腾”
  • 逛了6个小时的上海车展。有些不太成熟的感受。与你分享。
  • 释新闻|西葡大停电为何规模大、恢复慢?可再生能源是罪魁祸首?