美文网首页
HTML 水平居中和垂直居中

HTML 水平居中和垂直居中

作者: WPeach | 来源:发表于2017-03-11 12:58 被阅读0次

水平居中

  1. 文字居中
text-align:center;
  1. 图片居中
/*图片的父级div*/
text-align:center;
  1. 绝对定位元素 居中
margin: 0 auto;
  1. 相对定位 负边距居中
/*适合于已知宽度*/
width:100px;
position:relative;
left:50%;
margin-left:-50px;

垂直居中

文字设置line-height

line-height:40px;

div 最常用的是负边距居中

top:50%;
margin-top:-50px;

相关文章

  • css水平居中和水平垂直居中

    水平居中和水平垂直居中demo

  • HTML 水平居中和垂直居中

    水平居中 文字居中 图片居中 绝对定位元素 居中 相对定位 负边距居中 垂直居中 文字设置line-height ...

  • 常用的居中方法

    本文将介绍的居中方法有 ,水平居中,垂直居中和水平垂直居中。 一水平居中 二水平垂直居中

  • css 居中

    居中有水平居中和垂直居中。 水平居中+垂直居中 flex法 position法 就是计算呗~ 参考 CSS各种居中...

  • flexbox

    1.水平垂直居中。在html的布局中,水平垂直居中是一个经常能遇到的布局方式。 (三行代码实现下面图片的水平垂直居...

  • 居中对齐

    行内元素居中[#hang]垂直居中[#hc]水平居中[#hs] 块级元素居中[#kuai]垂直居中[#kc]水平居...

  • 水平居中与垂直居中

    水平居中和垂直居中可以说是在开发中经常遇到的问题,网上搜索水平居中和垂直居中的方法有很多,有的方法并不是很好,所以...

  • 实现元素水平居中的五种方法

    概述 我们平时看到的居中效果主要分为三大类,水平居中,垂直居中和水平垂直居中,在这里总结以下元素水平居中的方法。 ...

  • 水平居中和垂直居中

    水平居中设置--行内元素 水平居中设置--定宽块级元素 水平居中设置--不定宽块状元素 垂直居中--父元素高度确定...

  • 水平居中和垂直居中

    #水平居中 1.1.已知宽度块元素宽度 : 1.2.文本内容居中: 1.3.通过表格: 1.4.已知宽度,通过设置...

网友评论

      本文标题:HTML 水平居中和垂直居中

      本文链接:https://www.haomeiwen.com/subject/pgyagttx.html