<!-- 这里a.png必须是四边的框都有，限制，这个时候做里边文字的居中，首先在这个里边在套一个div悬浮（absolute或者float:left）,然后在这个div（必须设宽高和margin）里边的p标签在inline和text-align ，-->
<div style="height: 200px;width:800px;background:url('a.png');margin:100px auto;" id="box">
<!--<div><span>我们的好孩子</span></div> -->
<p> 我们的好孩子</p>
</div>

当div有边框图片的时候，怎么实现内部的p标签的水平和垂直居中的更多相关文章

  1. 【转】如何让DIV水平和垂直居中

    来源:http://blog.163.com/www.wxs_123/blog/static/82784664201321831746921/ 我们在设计页面的时候,经常要把DIV居中显示,而且是相对 ...

  2. 如何让DIV相对于body水平和垂直居中

    我们在设计页面的时候,经常要把DIV居中显示,而且是相对页面窗口水平和垂直方向居中显示,如让登录窗口居中显示.我们传统解决的办法是用纯CSS来让DIV居中.在本文中,我将给大家讲述如何用CSS和jQu ...

  3. 让DIV中的内容水平和垂直居中

    让一个层水平垂直居中是一个非常常见的布局方式,但在html中水平居中使用margin:0px auto;可以实现,但垂直居中使用外边距是无法达到效果的.(页面设置height:100%;是无效的),这 ...

  4. 第 23 章 CSS3 边框图片效果

    学习要点: 1.属性初探 2.属性解释 3.简写和版本 主讲教师:李炎恢 本章主要探讨 HTML5 中 CSS3 中边框图片背景的效果,通过这个新属性让边框更加的丰富多彩. 一．属性解释 CSS3 提 ...

  5. CSS第四天总结 更多的属性 圆角 边框图片 段落属性 颜色渐变 盒子阴影

    圆角边框: border-radius    一个值时表示四个角用的圆半径,4个值时分别是左上角.右上角.左下角.右下角,单位可以是px和百分比,百分比是半径相对于边框长度的比例 在CSS3中我们终于 ...

  6. CSS3之边框图片border-image

    CSS3中有关border的属性,还有很多,今天我将为大家介绍一个很好玩的属性——Border-image.有了CSS3之边框图片Border-image,我们可以轻松搞定圆角,轻松搞定很多之前难搞的 ...

  7. 第八十节，CSS3边框图片效果

    CSS3边框图片效果 学习要点: 1.属性初探 2.属性解释 3.简写和版本 本章主要探讨HTML5中CSS3中边框图片背景的效果,通过这个新属性让边框更加的丰富多彩. 一．属性解释     CSS3 ...

  8. CSS3 02. 边框、边框圆角、边框阴影、边框图片、渐变、线性渐变、径向渐变、背景、过渡transition、2D转换

    边框圆角 border-radius 每个角可以设置两个值,x值.y值 border-top-left-radius:水平半径 垂直半径 border-radius:水平半径/垂直半径 border- ...

  9. 从零开始学 Web 之 CSS3（四）边框图片，过渡

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

随机推荐

  1. ASP.NET Core 中文文档 第三章 原理（2）中间件

    原文:Middleware 作者:Steve Smith.Rick Anderson 翻译:刘怡(AlexLEWIS) 校对:许登洋(Seay) 章节: 什么是中间件 用 IApplicationBu ...

  2. 利用Python进行数据分析(13) pandas基础: 数据重塑/轴向旋转

    重塑定义     重塑指的是将数据重新排列,也叫轴向旋转. DataFrame提供了两个方法: stack: 将数据的列“旋转”为行. unstack:将数据的行“旋转”为列. 例如: 处理堆叠格式 ...

  3. scikit-learn一般实例之七:使用多输出评估器进行人脸完成

    本例将展示使用多输出评估期来实现图像完成.目标是根据给出的上半部分人脸预测人脸的下半部分. 第一列展示的是真实的人脸,接下来的列分别展示了随机森林,K近邻,线性回归和岭回归对人脸下半部分的预测. # ...

  4. Linux主机上实现树莓派的交叉编译及文件传输,远程登陆

    0.环境 Linux主机OS:Ubuntu14.04 64位,运行在wmware workstation 10虚拟机 树莓派版本:raspberry pi 2 B型. 树莓派OS:官网下的的raspb ...

  5. 浅谈Static关键字

    1.使用static关键字声明的属性为全局属性 未使用static关键字指定city之前,如果需要将Tom,Jack,Mary三人的城市均改成Beijing,需要再次声明三次对象的city为Beiji ...

  6. python之最强王者（4）——字符串

    1.Python 中文编码 前面章节中我们已经学会了如何用 Python 输出 "Hello, World!",英文没有问题,但是如果你输出中文字符"你好,世界" ...

  7. mysql主从之slave-skip-errors和sql_slave_skip_counter

    一般来说,为了保险起见,在主从库维护中,有时候需要跳过某个无法执行的命令,需要在slave处于stop状态下,执行 set global sql_slave_skip_counter=1以跳过命令.但 ...

  8. ArcGIS Engine开发之TocControl

    TocControl控件简介 TocControl控件的主要作用是显示当前加载的图层有哪些.采用什么样的符号等,目的是使用户对当前加载的数据有一个总体的把握.与之相关联的伙伴控件有:MapContro ...

  9. 如何用CSS画三角形

    很多时候页面都需要一个或者多个小型三角形!多数人直接用PS扣个图片预览 下面用CSS简单画几个最终效果如下图 <div class="border-all-color"> ...

  10. 沙盒SandBox

    每个App都有自己的沙盒,也就是一个存储空间.App之间没有权限访问对方的沙盒资源.沙盒的目录下有三个文件夹:Documents.Library.temp 目录结构 Documents:用于存储用户数 ...