zoukankan      html  css  js  c++  java
  • css居中

    序號 針對類型 設置 限制
    1 水平居中 margin-left:'auto',margin-right:'auto' 浮動元素和絕對定位元素無效
    2 行內元素水平居中 text-align:'center' 在ie6,ie7可以適應任何元素
    3 單行文字垂直居中 line-height:父容器的高度 多行文字不適應
    4 使用表格td/th align:'center',valign:'middle'  
    5 css控制表格 valign:‘middle’,text-align:‘center’ text-align適用於ie6,ie7,其它ie8+,火狐谷歌等瀏覽器只能適用於行內元素,塊級元素只能使用align居中
    6 非表格元素 display:table-cell,valign:middle,text-align:center 適用於ie8+、谷歌火狐主流瀏覽器,對於ie6、ie7無效
    7 絕對元素居中 position:absolute,left:50%,margin-left:-50px,top:50%,margin-top:-50px  
    8 絕對元素居中

    position:absolute,left:0,right:0,top:0,bottom:0,margin:auto

     
    9 浮動+相對定位

    flaot:left,position:relative,left:50%等等

    必須增加一個包裹的父元素
    10 font-size垂直居中 父元素:fontsize:父元素高度/1.14子元素:vetical-align:middle ie6,ie7有效,父元素高度已知,子元素寬高未知

     需要解決的是不同瀏覽器的居中方案搭配問題。

    https://www.cnblogs.com/2050/p/3392803.html

  • 相关阅读:
    网站首页蒙灰CSS样式
    MATLAB数值计算编程题
    通过P/Invoke控制继电器
    Java实习生入职测试
    navicat for mongodb12破解
    用svg绘制圣诞帽
    Excel条件格式
    10道算法题
    从事软件开发工作10年后的总结
    ASP.NET Core MVC+EF Core从开发到部署
  • 原文地址:https://www.cnblogs.com/Zhengxiaoxiao/p/10606111.html
Copyright © 2011-2022 走看看