HTML示例03---标题的对齐方式

逃离我推掉我的手 2022-03-19 13:44 1242阅读 0赞

**1.说明**

html的标题标记共有6个，分别是<h1>、<h2>、<h3>、<h4>、<h5>、<h6>，每一个标记在字体大小上都有明显的区别，从<h1>标记到<h6>标记依次变小。

在默认的情况下，标题文字是左对齐的，而在网页制作的过程中，可以实现标题文字的编排设置。最常用的就是关于对齐方式的设置，可以为标题标记添加align属性进行设置。

语法格式如下：

<h1 align="对齐方式">文本内容</h1>

**align对齐方式有三种**：left（文字左对齐）、center（文字居中对齐）以及right（文字右对齐）。

下面给出了一个利用上述特性推荐商品信息的html例子。

**2.代码**

**注：**需要注意的是代码中图片地址需要换成你自己指定图片的地址，也就是img src=.....位置

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>介绍图书商品</title>
    </head>
    <body>
    <h1 align="center"><img src="../images/百年孤独.png" alt="百年孤独"></h1>
    <h5 align="center">书名：《百年孤独》</h5>
    <h5 align="center">作者：马尔克斯</h5>
    <h5 align="center">出版社：人民邮电出版社</h5>
    <h5 align="center">出版时间：2017年1月</h5>
    <h5 align="center">页数：463页</h5>
    <h5 align="center">价格：25.00</h5>
    </body>
    </html>

**3.运行结果**

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NpbmF0XzMzNzE4NTYz_size_16_color_FFFFFF_t_70][]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NpbmF0XzMzNzE4NTYz_size_16_color_FFFFFF_t_70]: /images/20220319/db1eb4703c2d4e36898ce93c082051ca.png

发表评论取消回复

表情：

评论列表（有 0 条评论，1242人围观）

还没有评论，来说两句吧...

相关阅读

相关 Java对齐方式：对象内存布局问题示例

在Java编程中，对象的内存布局是非常关键的一部分。以下是一个简单的示例，展示了对象内存布局的问题： ```java // 假设我们有一个Person类，包含name和age

朱雀/ 2024年11月23日 06:33/ 0 赞/ 19 阅读

相关 css 对齐方式

图片垂直对齐（vertical-align）默认: baseline – 一行内文本的下方。 middle – 一行内小写字母的高度的1/2 设置各对象的vert

迈不过友情╰/ 2022年12月12日 04:57/ 0 赞/ 235 阅读

相关 html 文档标题使用,HTML Title text用法及代码示例

DOM标题文本属性用于设置或返回文档标题的文本。用法: 它返回text属性。titleObject.text 它用于设置text属性。titleObject.text

ゝ一世哀愁。/ 2022年10月06日 08:55/ 0 赞/ 209 阅读

相关结构对齐示例

结构对齐示例 Visual Studio 2013 [其他版本][Link 1] ![ImageSprite.png][] 此主题尚未评级 \- [评价此主题][L

缺乏、安全感/ 2022年09月19日 00:20/ 0 赞/ 169 阅读

相关 struct 成员的对齐方式

//用一个宏定义FIND求结构体struct s中某个成员变量member相对struct s的偏移量. //思考：若struct s的地址为0，则其成员member的地址

╰半夏微凉°/ 2022年07月14日 13:20/ 0 赞/ 153 阅读

相关内存对齐方式

一般我们编程的时候short s=2,int i=4,char c=’a’在内存中是如何对齐的呢？在32位系统中： ![这里写图片描述][SouthEast] 在

野性酷女/ 2022年06月09日 09:26/ 0 赞/ 301 阅读

相关 HTML中图片和文字的对齐方式

文字和图片的对齐方式会影响到页面的整体效果，之前没有仔细研究过。 <!doctype html> <html lang="en"> <head>

╰+攻爆jí腚メ/ 2022年05月08日 05:52/ 0 赞/ 2978 阅读

相关表单短标题（2、3、4个字）的两端对齐－ HTML + CSS

原文：[https://blog.csdn.net/muyutingfeng2008/article/details/48263073][https_blog.csdn.net

约定不等于承诺〃/ 2022年04月16日 00:06/ 0 赞/ 367 阅读

相关 HTML示例03---标题的对齐方式

1.说明 html的标题标记共有6个，分别是<h1>、<h2>、<h3>、<h4>、<h5>、<h6>，每一个标记在字体大小上都有明显的区别，从<h1>标记到<h6>标记依

逃离我推掉我的手/ 2022年03月19日 13:44/ 0 赞/ 1243 阅读

相关 HTML-标题

在 HTML 文档中，标题很重要。 HTML 标题标题（Heading）是通过 <h1> - <h6> 等标签进行定义的。 <h1> 定义最大的标题。<h6>

灰太狼/ 2021年10月30日 01:36/ 0 赞/ 405 阅读