css 居中方式

居中分为水平居中垂直居中

1. 水平居中1.1 文字text-align:center;1.2 盒子1.2.1:inline-block + text-align 一 center;1.2.2:absolute+transform 一 父元素 display:relative;子元素 display:absolute; left:50%;transform: translatex(-50%);1.2.3:absolute + margin 一 父元素 display:relative;子元素 display:absolute; left: 0; right: 0; margin:auto;1.3 文字/盒子flex布局父元素 display:flex; justify-content: center;
2. 垂直居中2.1 文字 line-heightline-height = height2.2 盒子2.2.1 父元素 display:relative;子元素 display:absolute; top: 50%;transform: translateY(-50%);2.2.2: absolute+transform
父元素 display:relative;子元素 displav:absolute: top: 0: bottom: 0: margin:auto:2.2.3: absolute + margin2.3文字/盒子2.3.1 flex布局父元素 displav:flex:alian-items: center:2.3.2: table布局父元素 display:table-cell; vertical-align:middle:

在这里插入图片描述

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

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

相关文章

Git教程学习:03 记录每次更新到仓库

文章目录 1 检查当前文件状态2 跟踪新文件3 暂存已修改的文件4 状态简览5 忽略文件6 查看已暂存和未暂存的修改7 提交更新8 跳过使用暂存区域9 移除文件10 移动文件 现在我们的机器上有了一个 真实项目 的 Git 仓库,并从这个仓库中检出了所有文件的 工作副本。 通常…

git设置代理

git设置代理 git config --global http.proxy 127.0.0.1:7890git查询代理 git config --global http.proxy git取消代理 git config --global --unset http.proxy

揭开UI设计的神秘面纱:如何打造一款让用户爱不释手的移动APP

文章目录 一、目标用户分析二、设计风格和色彩搭配三、布局和导航设计四、交互设计五、视觉元素设计六、响应式设计七、测试和优化八、持续更新和迭代九、团队协作和沟通十、学习和成长《移动APP UI设计与制作(微课版)》编辑推荐内容简介目录 《Flutter入门经典(移动…

matlab simulink 7自由度横向车辆模型

1、内容简介 略 32-可以交流、咨询、答疑 2、内容说明 图一.七自由度车辆动力学模型 纵向力平衡方程: ① 侧向力平衡方程: ② 绕Z轴力矩平衡方程: ③ 四个车轮的力矩平衡方程: ④ 上述方程中:δ为前轮转角&#x…

官宣!Meta正在训练Llama 3,将继续开源

1月19日,全球社交、科技巨头Meta的联合创始人兼首席执行官-Zuck(扎克伯格)在is宣布,正在训练Llama 3并且以负责任地方式继续开源。 Zuck表示,预计到2024年底,Meta将拥有350,000块H100,如果算上…

PyTorch各种损失函数解析:深度学习模型优化的关键(1)

目录 详解pytorch中各种Loss functions binary_cross_entropy 用途 用法 参数 数学理论 示例代码 binary_cross_entropy_with_logits 用途 用法 参数 数学理论 示例代码 poisson_nll_loss 用途 用法 参数 数学理论 示例代码 cosine_embedding_loss 用途 …

数据结构--串

本文为复习的草稿笔记,,,有点乱 1. 串的基本概念和基本操作 串是由零个或多个字符组成的有限序列 2. 串的存储结构 3.串的应用 模式匹配 BF算法(简单匹配算法 穷举法 算法思路:从子串的每一个字符开始依次与主串…

卷积神经网络和深度神经网络的区别与联系

DNN是指深度神经网络,它是一个很广的概念,某种意义上CNN、RNN、GAN等都属于其范畴之内。DNN与CNN([卷积神经网络)的区别是DNN特指全连接的神经元结构,并不包含卷积单元或是时间上的关联。其中最初的神经网络的所有隐含…

尚硅谷Nginx高级配置笔记

写在前面:本笔记是学习尚硅谷nginx可成的时候的笔记,不是原创,如有需要,可以去官网看视频,以下是pdf文件 Nginx高级 第一部分:扩容 通过扩容提升整体吞吐量 1.单机垂直扩容:硬件资源增加 云…

基于Java SSM框架实现中学校园网站管理系统项目【项目源码+论文说明】计算机毕业设计

基于java的SSM框架实现中学校园网站管理系统演示 摘要 21世纪的今天,随着社会的不断发展与进步,人们对于信息科学化的认识,已由低层次向高层次发展,由原来的感性认识向理性认识提高,管理工作的重要性已逐渐被人们所认…

2024-01-15(SpringMVCMybatis)

1.拦截器:如果我们想在多个handler方法(controller中的方法)执行之前或者之后都进行一些处理,甚至某些情况下需要拦截掉,不让handler方法执行,那么就可以使用SpringMVC为我们提供的拦截器。 拦截器和过滤器的区别:过滤…

【C++ Primer Plus】2.1 进入C++

代码示例 #include <iostream> // a preprocessor directive 预处理器指令 int main () // function header { // start of function bodyusing namespace std; // make definitions visiblecout << "hello!"; // message…