zoukankan      html  css  js  c++  java
  • css一些特别效果设定

    在CSS中,BOX的Padding属性的数值赋予顺序为

    padding:10px;                           四个内边距都是10px
    padding:5px 10px;   上下5px 左右10px
    padding:5px 10px 15px; 上5px 右10px 下15px 左因为缺省与右相等,则为10px
    padding:5px 10px 15px 20px; 上5px 右10px 下15px  左20px



    div水平和垂直居中,text-align和vertical-align不起作用,因为标签div没有这两个属性,所以再css中设置这两个值不能居中的效果。

    1. div水平居中:设置margin的左右边距为自动。

    1 div
    2 {
    3      margin:0 auto;
    4 }

    2.   div中的元素居中

    2.1 div中的文字居中:将div的行高设置跟其高度一样的值。

    1 div
    2 {
    3     height:200px;
    4     line-height:200px;
    5 }

    2.2 div中的图片居中,方法一:将div的行高设置跟其高度一样的值,将其中的图片img外套上标签i,设置i和div同时垂直居中

    复制代码
     1 div
     2 {
     3      200px;
     4     height: 200px;
     5     line-height: 200px;
     6     vertical-align: middle;
     7     background-color: Gray;
     8 }
     9 div i
    10 {
    11     vertical-align: middle;
    12 }
    复制代码

    2.3 div中的图片居中,方法二:将div转换成tablecell,让后设置vertical-align属性居中。

    复制代码
    1 div
    2 {
    3      200px;
    4     height: 200px;
    5     display: table-cell;
    6     vertical-align: middle;
    7     background-color: Gray;
    8 }
    复制代码
     
     
  • 相关阅读:
    平均要取多少个(0,1)中的随机数才能让和超过1
    perl学习笔记
    K-means
    Mysql数据库常用操作整理
    ETL模型设计
    c++ 面试整理
    vim display line number
    inux 下的/etc/profile、/etc/bashrc、~/.bash_profile、~/.bashrc 文件的作用
    Linux命令大总结
    perl learning
  • 原文地址:https://www.cnblogs.com/oisiv/p/5813560.html
Copyright © 2011-2022 走看看