CSS文字居中对齐学习

CSS使用text-align属性设置文字对齐方式;text-align:center,这样就设置了文字居中对齐;

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title>css 水平居中</title><style>.box {background: pink;text-align:center;}h1 {text-align:center;}</style></head><body><h1>我是标题</h1><div class="box" style="width: 200px;height: 100px;border: 3px solid green;">AAB文本BCC</div><div class="box" style="width: 100px;height: 50px;border: 3px solid green;">文字</div><p class="box">2021 年 01 月 01 号</p><a class="box" url="">aaaaa请单击ccccccccc</p><table border="1"><tr><td>A</td><td>行1,列2</td></tr><tr><td>行2,列1</td><td>行2,列2</td></tr></table></body></html>

做一个html文档,网页元素包括:h1, 一个div,一个div,一个p(段落),一个链接(a),一个表格;

定义了CSS样式类box,其中指定了背景色为pink,文字对齐为居中对齐;定义了h1元素的文字对齐方式为居中;

2个div引用了css类box;p和a也引用了样式类box;

运行如下;

h1的文字居中对齐了;

2个div也是;

p元素没有指定宽度的情况下默认占一整行,文字也居中对齐了;

a元素指定文字居中对齐看上去没有意义,a元素的默认宽度自动调整为其中文字占据的宽度;

表格没有指定单元格的文字对齐方式,<td>A</td> 这个单元格的文字宽度不够单元格宽度,默认是居中对齐的;

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/132142.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【SpringBoot集成Redis + Session持久化存储到Redis】

目录 SpringBoot集成Redis 1.添加 redis 依赖 2.配置 redis 3.手动操作 redis Session持久化存储到Redis 1.添加依赖 2.修改redis配置 3.存储和读取String类型的代码 4.存储和读取对象类型的代码 5.序列化细节 SpringBoot集成Redis 1.添加 redis 依赖 …

Redis从入门到精通(二:数据类型)

数据存储类型介绍 Redis 数据类型&#xff08;5种常用&#xff09; string hash list set sorted_set/zset&#xff08;应用性较低&#xff09; redis 数据存储格式 redis 自身是一个 Map&#xff0c;其中所有的数据都是采用 key : value 的形式存储 数据类型指的是存储的数据…

关于接口自动化,你不能不知道的高级技巧——接口自动化神器apin进阶操作

一、变量提取和引用 变量提取和引用主要是为了解决接口之间的参数依赖问题。 使用场景&#xff1a;接口 A 的参数中需要使用接口 B 返回的某个数据&#xff0c;那么就要在请求 B 接口之后&#xff0c;提取数据保存&#xff0c;给请求 A 接口时使用。 1、变量提取 在用例集或…

【开发】视频集中存储/直播点播平台EasyDSS点播文件分类功能优化

视频推拉流EasyDSS视频直播点播平台&#xff0c;集视频直播、点播、转码、管理、录像、检索、时移回看等功能于一体&#xff0c;可提供音视频采集、视频推拉流、播放H.265编码视频、存储、分发等视频能力服务。 TSINGSEE青犀视频的EasyDSS平台具有点播文件分类展示方法&#xf…

【智慧工地源码】物联网和传感器技术在智慧工地的应用

物联网&#xff08;IoT&#xff09;和传感器技术在智慧工地中扮演着至关重要的角色。这些技术的应用&#xff0c;使得智慧工地能够实现对施工过程的精确监控、数据收集和分析&#xff0c;以及设备互联&#xff0c;从而提高工程效率、减少成本并改善工人的工作环境。 一、物联网…

9.13号作业

1> 将之前定义的栈类和队列类都实现成模板类 栈的模块类 #include <iostream> using namespace std;template <typename T> class Stack { private:T data[40]{0};T top-1; public:Stack (){cout<<"这是构造函数"<<endl;}int stack_e…

关于 Unity 连接 MuMu 模拟器上的 Unity Remote 5 的方法

在使用 Unity 开发 Android 的过程中&#xff0c;可以通过使用 Unity Remote 这个 app 来和真机连接&#xff0c;进而在真实环境下进行测试性能等工作&#xff0c;而本次则是由于其他问题引出的一个小坑&#xff0c;记录以备后续查询。 这次是由于在自学过程中遇到的一个工程&…

应用在Wi-Fi音箱中的国产高性能DSP音频处理芯片

WiFi音箱的工作原理是通过无线路由器&#xff0c;将音箱接入到外部网络当中&#xff0c;然后在通过手机、平板、电脑等设备连接音箱&#xff0c;通过一些多媒体协议将音乐推送到音箱当中进行播放&#xff0c;WiFi音箱具有着传输能力强&#xff0c;可同时连接多个设备进行播放等…

c\c++ windows自动打开cmd并进入mysql

每次不用可视化工具查看数据库的时候饭都要winr->cmd->mysql -u root -p->密码 虽然不麻烦但是多少也得消耗你几秒钟&#xff0c;秉承着时间就是金钱的观念 我决定通过windows模拟输入实现快速通过命令行查看mysql数据库 涉及到的知识: windows拉起进程&#xff0c;…

uniapp 微信小程序最新隐私弹窗更新方案,更新后无法登录问题解决方案

1&#xff0c;在manifest.json文件中的mp-weixin 节点下&#xff0c;添加&#xff1a;"__usePrivacyCheck__": true 2&#xff0c;在需要的页面配置隐私保护弹窗&#xff0c;或者直接写到首页也可以 <uni-popup ref"popusAuthorization" type"cen…

【目标检测】YOLOv8:快速上手指南

YOLOv8概述 YOLOv8是YOLOv5团队在今年新推出的一代YOLO版本&#xff0c;与前几代版本相比&#xff0c;其性能和速度差距如下图所示&#xff1a; 和其它版本不同的是&#xff0c;该仓库并非起名为YOLOv8&#xff0c;而是公司名ultralytics&#xff0c;因为他们想将此版本作为一…

RK3399 android7.1 实现双wifi功能 STA+AP

wifi模组&#xff1a; 主板使用的wifi模块为海华AW-NM43438W模组以及客户提供了一款USB接口的5G双频无线网卡RTL8821CU。 双wifi功能实现效果&#xff1a; 主板自带的wifi模组作为station正常连接外部wifi,USB接口的外接网卡作为AP&#xff08;热点&#xff09;供其他设备连接…

自动驾驶之高精地图介绍

高精地图 文章目录 高精地图前言什么是高精地图高精数据分发引擎1.3 名词解释1. ADAS(Advanced DriverAssistance System)2. 为什么需要高精数据的分发引擎 高精数据分发引擎的建设高精数据分发引擎与ADAS应用的关系高精数据分发引擎架构高精数据分发引擎的模型表达路网模型的抽…

IMAU鸿蒙北向开发-2023年9月5日学习日志

1. 5种调试方式 1.1 Previewer 在侧边 Previewer 选项卡内可以预览Entry。 如果要单独预览组件&#xff0c;可以在给组件加Preview 装饰器 1.2 Local Emulator&#xff08;本地模拟&#xff09; 1.3 Remote Emulator&#xff08;远程模拟&#xff09; 使用时需要登录华为开发…

机器学习开源工具BatteryML,一站式分析与预测电池性能

编者按&#xff1a;天下苦锂电池寿命久矣&#xff0c;时闻“开车出&#xff0c;推车回”&#xff0c;又闻“充电两小时&#xff0c;待机两分钟”&#xff0c;亦闻“气温骤降&#xff0c;请注意电池保暖”……随着以锂离子电池为动力源的产品&#xff0c;如手机、电脑、新能源汽…

python3对文件编码的转换处理

前言&#xff1a; 嗨喽~大家好呀&#xff0c;这里是魔王呐 ❤ ~! python更多源码/资料/解答/教程等 点击此处跳转文末名片免费获取 公司同事邀我一起给SQLSERVER 2008导数&#xff0c; 数据来源有高斯和ORACLE, 数据文件保存格式有UTF-8和GBK。 当我在做测试导入的时候发现S…

【再识C进阶2(下)】详细介绍指针的进阶——利用冒泡排序算法模拟实现qsort函数,以及一下习题和指针笔试题

前言 &#x1f493;作者简介&#xff1a; 加油&#xff0c;旭杏&#xff0c;目前大二&#xff0c;正在学习C&#xff0c;数据结构等&#x1f440; &#x1f493;作者主页&#xff1a;加油&#xff0c;旭杏的主页&#x1f440; ⏩本文收录在&#xff1a;再识C进阶的专栏&#x1…

2023备战秋招Java面试八股文合集

Java就业大环境仍然根基稳定&#xff0c;市场上有很多机会&#xff0c;技术好的人前景就好&#xff0c;就看你有多大本事了。小编得到了一份很不错的资源&#xff0c;建议大家可以认真地来看看以下的资料&#xff0c;来提升一下自己的核心竞争力&#xff0c;在面试中轻松应对面…

学习笔记|回顾(1-12节课)|应用模块化的编程|添加函数头|静态变量static|STC32G单片机视频开发教程(冲哥)|阶段小结:应用模块化的编程(上)

文章目录 1.回顾(1-12节课)2.应用模块化的编程(.c .h)Tips:添加函数头创建程序文件三步引脚定义都在.h文件函数定义三步bdata位寻址变量的使用 3.工程文件编写静态变量static的使用完整程序为&#xff1a;demo.c&#xff1a;seg_led.c:seg_led.h: 1.回顾(1-12节课) 一、认识单…

docker系列(3) - 常用软件安装

文章目录 3. docker安装常用软件3.1 安装nginx3.2 安装redis3.3 安装mysql3.4 部署springboot程序3.4.1 编写dockerfile3.4.2 构建镜像3.4.3 启动镜像 3. docker安装常用软件 3.1 安装nginx docker pull nginx#挂载启动 docker run -it -d \ --namenginx \ --networkpub_netw…