主页 > 知识库 > 文字或图片元素在DIV中垂直居中

文字或图片元素在DIV中垂直居中

热门标签:车载电话机器人 无锡电销外呼系统代理 外呼系统号码显示 南昌crm外呼系统如何 中山外呼系统中间件 地图标注多家店 广州ai外呼系统业务 什么行业需要电话机器人 天津企业外呼系统代理商
复制代码 代码如下:

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
html xmlns="http://www.w3.org/1999/xhtml"> 
head> 
meta http-equiv="Content-Type" content="text/html; charset=GB2312" /> 
title>Untitled Document/title> 
style type="text/css"> 
!-- 
.frame{ 
    float:left; 
    margin:2px; 

.outer { 
    height: 250px; 
    width: 240px; 
    overflow: hidden; 
    background:gold; 
    position: static !important; 
    position: relative; 
    display: table !important; 

#middle { /* for explorer only*/ 
    position: absolute; 
    top: 50%; 

#middle[id] { 
    display: table-cell; 
    vertical-align: middle; 
    position: static; 

#inner { /* for explorer only */ 
    position: relative; 
    top: -50%; 
    width: 100%; 
    margin: 0 auto; 
    text-align:center 

/style> 
/head> 

body> 
div class="frame"> 
    div class="outer"> 
        div id="middle"> 
            div id="inner">img src="http://bbs.blueidea.com/images/smilies/eek.gif" alt="" />/div> 
        /div> 
    /div> 
/div> 
div class="frame"> 
    div class="outer"> 
        div id="middle"> 
            div id="inner"> 
                img src="http://bbs.blueidea.com/images/smilies/eek.gif" alt="" />br />br /> 
                img src="http://bbs.blueidea.com/images/smilies/eek.gif" alt="" /> 
            /div> 
        /div> 
    /div> 
/div> 
div class="frame"> 
    div class="outer"> 
        div id="middle"> 
            div id="inner">图片与文本内容混合br>img src="http://desk.blueidea.com/QTZY/GIF/xsgs_21/xsgs_21004.gif" alt="" />br>图片与文本内容混合/div> 
        /div> 
    /div> 
/div> 
div class="frame"> 
    div class="outer"> 
        div id="middle"> 
            div id="inner">span>图片与文本/span>img src="http://desk.blueidea.com/QTZY/GIF/xsgs_21/xsgs_21004.gif" alt="" align="middle" />span>图片与文本/span>/div> 
        /div> 
    /div> 
/div>
div class="frame"> 
    div class="outer"> 
        div id="middle"> 
            div id="inner">5454545445445br>5454545445445br>5454545445445br>5454545445445br>5454545445445br>5454545445445br>5454545445445br>5454545445445br>/div>
/div> 
    /div> 
/div>
/body> 
/html>

您可能感兴趣的文章:
  • iOS - UIButton(UIEdgeInsets)/设置button上的文字和图片上下垂直居中对齐
  • CSS图片响应式 垂直水平居中
  • js+CSS 图片等比缩小并垂直居中实现代码
  • javascript图片自动缩放和垂直居中处理函数
  • 用css实现图片垂直居中的使用技巧
  • 未知大小图片在已知容器中的垂直和水平居中问题
  • JS实现图片垂直居中显示小结

标签:钦州 仙桃 吕梁 泰州 沧州 佛山 攀枝花 海西

巨人网络通讯声明:本文标题《文字或图片元素在DIV中垂直居中》,本文关键词  文字,或,图片,元素,在,DIV,;如发现本文内容存在版权问题,烦请提供相关信息告之我们,我们将及时沟通与处理。本站内容系统采集于网络,涉及言论、版权与本站无关。
  • 相关文章
  • 下面列出与本文章《文字或图片元素在DIV中垂直居中》相关的同类信息!
  • 本页收集关于文字或图片元素在DIV中垂直居中的相关信息资讯供网民参考!
  • 推荐文章