怎么用HTML语言实现文本居中

超文本标记语言(HTML)是大多数网页在编辑时所使用的语言,用于排版,段落,加粗和字号。如果你在编辑一个网页的HTML程序,可以试试两种文本编辑的方法:HTML和层叠式工作表(CSS)。你可以学习怎样用HTML的基本代码把文本居中。

方法 1 的 2:

通过HTML代码实现对齐

  1. 1 在准备编辑HTML网页之前,先了解一下HTML代码的基础知识。
    • 学习不同标签,你可以使用它们改变字号或者文本格式。比如在括号内的“b”用来把字体加粗。“i”用来表示斜体字。在代码中不要包括引号。 {"smallUrl":"https:\/\/www.zenmeban.com\/images_en\/thumb\/9\/95\/Center-Text-in-HTML-Step-1Bullet1.jpg\/v4-460px-Center-Text-in-HTML-Step-1Bullet1.jpg","bigUrl":"https:\/\/www.zenmeban.com\/images\/thumb\/9\/95\/Center-Text-in-HTML-Step-1Bullet1.jpg\/v4-728px-Center-Text-in-HTML-Step-1Bullet1.jpg","smallWidth":460,"smallHeight":319,"bigWidth":728,"bigHeight":505,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    • 练习使用配对标签。大多数格式标记需要两个标签,分别在文本的开头和结尾。第一个标签将包括标签括号内(<>)的字母和符号。第二个标签将包括一个反斜线,并位于标签之前。例如,在加粗的文本开头的括号内插入“b”,并在文本结尾的括号内插入“/b”。 {"smallUrl":"https:\/\/www.zenmeban.com\/images_en\/thumb\/c\/c7\/Center-Text-in-HTML-Step-1Bullet2.jpg\/v4-460px-Center-Text-in-HTML-Step-1Bullet2.jpg","bigUrl":"https:\/\/www.zenmeban.com\/images\/thumb\/c\/c7\/Center-Text-in-HTML-Step-1Bullet2.jpg\/v4-728px-Center-Text-in-HTML-Step-1Bullet2.jpg","smallWidth":460,"smallHeight":319,"bigWidth":728,"bigHeight":505,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
  2. {"smallUrl":"https:\/\/www.zenmeban.com\/images_en\/thumb\/5\/5c\/Center-Text-in-HTML-Step-2.jpg\/v4-460px-Center-Text-in-HTML-Step-2.jpg","bigUrl":"https:\/\/www.zenmeban.com\/images\/thumb\/5\/5c\/Center-Text-in-HTML-Step-2.jpg\/v4-728px-Center-Text-in-HTML-Step-2.jpg","smallWidth":460,"smallHeight":319,"bigWidth":728,"bigHeight":505,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 2 找出在网页中想要居中的文本。
  3. {"smallUrl":"https:\/\/www.zenmeban.com\/images_en\/thumb\/c\/cb\/Center-Text-in-HTML-Step-3.jpg\/v4-460px-Center-Text-in-HTML-Step-3.jpg","bigUrl":"https:\/\/www.zenmeban.com\/images\/thumb\/c\/cb\/Center-Text-in-HTML-Step-3.jpg\/v4-728px-Center-Text-in-HTML-Step-3.jpg","smallWidth":460,"smallHeight":319,"bigWidth":728,"bigHeight":505,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 3 在文本开头之前的括号内插入标签“center”。不要在标签和文本之前包括空格。
  4. {"smallUrl":"https:\/\/www.zenmeban.com\/images_en\/thumb\/1\/17\/Center-Text-in-HTML-Step-4.jpg\/v4-460px-Center-Text-in-HTML-Step-4.jpg","bigUrl":"https:\/\/www.zenmeban.com\/images\/thumb\/1\/17\/Center-Text-in-HTML-Step-4.jpg\/v4-728px-Center-Text-in-HTML-Step-4.jpg","smallWidth":460,"smallHeight":319,"bigWidth":728,"bigHeight":505,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 4 在文本结尾后的括号内插入“/center”。不要包括空格。
  5. {"smallUrl":"https:\/\/www.zenmeban.com\/images_en\/thumb\/7\/78\/Center-Text-in-HTML-Step-5.jpg\/v4-460px-Center-Text-in-HTML-Step-5.jpg","bigUrl":"https:\/\/www.zenmeban.com\/images\/thumb\/7\/78\/Center-Text-in-HTML-Step-5.jpg\/v4-728px-Center-Text-in-HTML-Step-5.jpg","smallWidth":460,"smallHeight":319,"bigWidth":728,"bigHeight":505,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 5 保存你的网页。浏览网页看看文本是否按要求对齐。
    • 如果没有改变文本的对齐方式,那么需要运用一个程序,比如HTML5这样使用CSS而不是HTML代码的程序。试试用第二种方法来正确的对齐文本。 {"smallUrl":"https:\/\/www.zenmeban.com\/images_en\/thumb\/8\/88\/Center-Text-in-HTML-Step-5Bullet1.jpg\/v4-460px-Center-Text-in-HTML-Step-5Bullet1.jpg","bigUrl":"https:\/\/www.zenmeban.com\/images\/thumb\/8\/88\/Center-Text-in-HTML-Step-5Bullet1.jpg\/v4-728px-Center-Text-in-HTML-Step-5Bullet1.jpg","smallWidth":460,"smallHeight":319,"bigWidth":728,"bigHeight":505,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
方法 2 的 2:

方法二:通过CSS代码实现对齐

  1. 1 在准备改变网页的CSS语言之前,先了解一下CSS的基础知识。CSS代码嵌入HTML代码,因为两种标记语言共同执行。
    • 了解文本主体标签h1,h2和h3。这些用来标记一个网页的段落,或者字号小一些的普通文本。h1是最大的标题,h2和h3次之。这与HTML中用来标识各个部分类似的语言。 {"smallUrl":"https:\/\/www.zenmeban.com\/images_en\/thumb\/8\/85\/Center-Text-in-HTML-Step-6Bullet1.jpg\/v4-460px-Center-Text-in-HTML-Step-6Bullet1.jpg","bigUrl":"https:\/\/www.zenmeban.com\/images\/thumb\/8\/85\/Center-Text-in-HTML-Step-6Bullet1.jpg\/v4-728px-Center-Text-in-HTML-Step-6Bullet1.jpg","smallWidth":460,"smallHeight":319,"bigWidth":728,"bigHeight":505,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    • 用圆括号代替尖括号。在“body”或“h1”之后将CSS标签插入圆括号内。例如,你可以把“text-indent:50px”插入圆括号内,表示缩进文本。在代码中不要包含引号。 {"smallUrl":"https:\/\/www.zenmeban.com\/images_en\/thumb\/7\/7d\/Center-Text-in-HTML-Step-6Bullet2.jpg\/v4-460px-Center-Text-in-HTML-Step-6Bullet2.jpg","bigUrl":"https:\/\/www.zenmeban.com\/images\/thumb\/7\/7d\/Center-Text-in-HTML-Step-6Bullet2.jpg\/v4-728px-Center-Text-in-HTML-Step-6Bullet2.jpg","smallWidth":460,"smallHeight":319,"bigWidth":728,"bigHeight":505,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
  2. {"smallUrl":"https:\/\/www.zenmeban.com\/images_en\/thumb\/1\/14\/Center-Text-in-HTML-Step-7.jpg\/v4-460px-Center-Text-in-HTML-Step-7.jpg","bigUrl":"https:\/\/www.zenmeban.com\/images\/thumb\/1\/14\/Center-Text-in-HTML-Step-7.jpg\/v4-728px-Center-Text-in-HTML-Step-7.jpg","smallWidth":460,"smallHeight":319,"bigWidth":728,"bigHeight":505,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 2 在想要编辑的文本开头找出HTML的括号。将要把CSS格式的代码写入HTML代码这一行的第一个括号内。
    • 例如,如果你想改变大标题,可以在括号内找到“h1”。 {"smallUrl":"https:\/\/www.zenmeban.com\/images_en\/thumb\/c\/c2\/Center-Text-in-HTML-Step-7Bullet1.jpg\/v4-460px-Center-Text-in-HTML-Step-7Bullet1.jpg","bigUrl":"https:\/\/www.zenmeban.com\/images\/thumb\/c\/c2\/Center-Text-in-HTML-Step-7Bullet1.jpg\/v4-728px-Center-Text-in-HTML-Step-7Bullet1.jpg","smallWidth":460,"smallHeight":319,"bigWidth":728,"bigHeight":505,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
  3. {"smallUrl":"https:\/\/www.zenmeban.com\/images_en\/thumb\/c\/c2\/Center-Text-in-HTML-Step-8.jpg\/v4-460px-Center-Text-in-HTML-Step-8.jpg","bigUrl":"https:\/\/www.zenmeban.com\/images\/thumb\/c\/c2\/Center-Text-in-HTML-Step-8.jpg\/v4-728px-Center-Text-in-HTML-Step-8.jpg","smallWidth":460,"smallHeight":319,"bigWidth":728,"bigHeight":505,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 3 把以下的代码插入“h1”之后,并位于尾括号之前:"text-align=center;" 。不要包括引号。
  4. {"smallUrl":"https:\/\/www.zenmeban.com\/images_en\/thumb\/2\/2c\/Center-Text-in-HTML-Step-9.jpg\/v4-460px-Center-Text-in-HTML-Step-9.jpg","bigUrl":"https:\/\/www.zenmeban.com\/images\/thumb\/2\/2c\/Center-Text-in-HTML-Step-9.jpg\/v4-728px-Center-Text-in-HTML-Step-9.jpg","smallWidth":460,"smallHeight":319,"bigWidth":728,"bigHeight":505,"licensing":"<div class=\"mw-parser-output\"><\/div>"} 4 在分号之后加入尾括号。保存网页。
    • 你也可以把“居中”换成“右对齐”,“左对齐”或者“两端对齐”等不同的排版方式。 {"smallUrl":"https:\/\/www.zenmeban.com\/images_en\/thumb\/9\/98\/Center-Text-in-HTML-Step-9Bullet1.jpg\/v4-460px-Center-Text-in-HTML-Step-9Bullet1.jpg","bigUrl":"https:\/\/www.zenmeban.com\/images\/thumb\/9\/98\/Center-Text-in-HTML-Step-9Bullet1.jpg\/v4-728px-Center-Text-in-HTML-Step-9Bullet1.jpg","smallWidth":460,"smallHeight":319,"bigWidth":728,"bigHeight":505,"licensing":"<div class=\"mw-parser-output\"><\/div>"}

所需资料

  • 基本的HTML技能
  • 基本的CSS技能
  • 网页


<<:  怎么吹竖笛

>>:  怎么用蓖麻油缓解便秘

怎么扮成动画角色或漫画角色

你花了好几个星期的时间来制作自己的角色扮演服装,终于大功告成。现在所需的只是最后的点睛之笔,那就是用...

怎么清除填缝剂上的霉斑

当填缝剂上开始长霉时,把它铲掉并重新填缝,是一项非常耗时的工程。幸好,要解决发霉问题,不一定非得这样...

怎么为小企业撰写商业计划书

商业计划书是介绍公司业务、企业规划和发展模式的书面文件。商业计划书会详细阐述公司的财务目标,然后结合...

怎么原谅别人

真诚地原谅曾经伤害过你的人,几乎和一开始遭受到伤害一样困难。仁慈地原谅某人,又不太居高临下,是一个非...

怎么赢得吃东西比赛

在竞技性的吃东西比赛上,你有机会赢得奖金,还能大吃一顿。吃东西比赛也分很多种。有比吃辣、比速度、比数...