

下载本文档
版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
1、div水平居中HTML+CSS #让div在屏幕中居中(水平居 中+垂直居中)方法总结 近写网页经常需要将div在屏幕中居中显示,遂记录下几个常用的方法,都比较简单。水平 居中直接加上标签即可,或者设置margin:auto;当然也可以用下面的方法下面说两种在屏 幕正中(水平居中+垂直居中)的方法 放上示范的html代码: MAIN 方法一:div使用绝对布局,设置margin:auto;并设置top、left、right、bottom的值相 等即可,不一走要都是0。 .main text-align: center;厂让div内部文字居中/ background-color: #fff; b
2、order-radius: 20px; width: 300px; height: 350px; margin: auto; position: absolute; top: 0; left: 0; right: 0; bottom: 0; 方法二:仍然是绝对布局,让left和top都是50% ,这在水平方向上让div的最左与屏幕 的最左相距50% ,垂直方向上一样,所以再用transform向左(上)平移它自己竟度(高 度)的50% ,也就达到居中效果了,效果图和上方相同。 .main text-align: center; background-color: #fff; border-radius: 20px; width: 300px; height: 350px; position: absolute; left: 50%; top: 50%; transform: translate(-50%#-50%); 方法三:对于水平居中,可以使用最简单的标签,不过已经过时了,用法如下: 123 1这个标签就是相对于标签里的文字,可以使其居中。 由于center标签已经过时了,所
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 水产养殖基地租赁合同范本
- 植物考试模拟题与参考答案
- 租赁车位合同简易版
- 工商局标准股份转让合同范本
- 职业生涯教育
- 跨国电子商务交易合作框架协议
- 城市基础设施建筑安装工程合同
- 施工现场安全防范与服务合同
- 索道站长工作总结
- 音乐教师聘用合同
- GB/T 33136-2024信息技术服务数据中心服务能力成熟度模型
- 《保护地球爱护家园》课件
- 雾化吸入疗法合理用药专家共识(2024版)解读
- 2024年度产学研合作与科研奖励协议3篇
- 电力工程线路交叉跨越施工主要工序及特殊工序施工方法
- 【MOOC】软件度量及应用-中南大学 中国大学慕课MOOC答案
- 24秋国家开放大学《儿童发展问题的咨询与辅导》周测验参考答案
- 2025届江苏省苏州市重点中学高三第二次模拟考试英语试卷含解析
- JJF(京) 124-2024 智能电表电动自行车充电辨识模组校准规范
- DB65-T 4783-2024 冰川资源遥感调查技术规范
- 护士中级职称竞聘述职课件
评论
0/150
提交评论