居中

2018-04-24  本文已影响8人  xingkong_s
flex居中
.vertical-container {
  height: 300px;
  display: -webkit-flex;
  display:         flex;
  -webkit-align-items: center;
          align-items: center;
  -webkit-justify-content: center;
          justify-content: center;
}
文本居中
text-align:center;  水平居中
padding-top=10px;
padding-bottom=10px;  垂直居中  或者  让line-height=height

//table 中使用vertical-align:middle;可以 是文字上下居中

div加宽度后居中 必须声明 doctype

margin:0 auto;     水平居中
position:absolute;    
top:50px

div里面包含2个a

display:-inline-block;
width:50%;
height:
text-align:center;

vertical-align作用到内联元素上时
我以我的哪条线(top、middle、bottom) 和别人对齐

border会继承color的颜色

width:  margin:0 auto;
水平居中跳动问题的修复

ie7、ie8

html{overflow-y:scroll;}

其他的

.container{padding-left:calc(100vw-100%);}
//100vw浏览器宽度   100%可用内容宽度  相减后就是滚动条的宽度
div 居中
.dialog--wrapper:after {
    display: inline-block;
    content: '';
    width: 0;
    height: 100%;
    vertical-align: middle;
}
.dialog_box {
    display: inline-block;
    border: 1px solid #ccc;
    vertical-align: middle;
}
选中标签:
<input type="radio" name="" id="" checked>
    <button disabled>点击</button>
    <select name="" id="">
      <option value="">1</option>
      <option value="" selected>2</option>
    </select>
上一篇下一篇

猜你喜欢

热点阅读