垂直居中:
           先height再ling-height,都设成一样高

span 垂直居中:vertical-align:50%
设置外边距:
           margin-top,margin-left,margin-right,margin-bottom
div背景单张铺满设置:
           width: 30px;
           height: 30px;
           line-height: 30px;
           background-image: url(../image/lzhf/one.png);
           background-repeat: no-repeat;
           background-size: 100% auto;

div浮在div上:
           <div style="position: relative;height: 30px;width: 100%">
              <div style="height: 30px; overflow: hidden;position: absolute;z-index: 2;width: 100%;">
                  <img alt="主要职责" style="width: 100%; height: 30px;"
                      src="../../image/ljfy/zcjgtop.png">
              </div>

<div style="position: absolute;z-index: 3;margin-left:10px;height: 30px;line-height: 30px;">
                  <img src="../../image/ljfy/zyzzc.png" width="30" height="30">
              </div>
              <div style="position: absolute;z-index: 3;margin-left: 38px;height: 30px;line-height: 30px;">
                  <font style="font-weight: bold">共有内设机构20个</font>
              </div>
          </div>

解决非固定宽度的浮动问题:

结束加上<div style="clear:both;height: 0px;"></div>

js改变背景颜色:
document.getElementById('mycolor').style.background=yc

显示不显示:

document.getElementById("ah2").style.display = "block";

$("#id").css('display','none');

$("#id")[0].style.display = 'none';

图片在div中居中显示(水平居中和垂直居中):
水平居中:div设置:text-align:center;
img设置:width:图片宽度; margin:0 auto;

垂直居中:div设置:position:relative;
img设置:position:absolute; top:50%; height:图片高度; margin-top:图片高度的一半;

让两个Div并排显示:

<div style="width:300px; height:auto; float:left; display:inline">AAAA</div>

<div style="width:300px; height:auto; float:left; display:inline">BBBB</div>

table中的td换行:

在table定义中,添加style="table-layout:fixed;"

在对需要换行的td中,添加style="word-break:break-all;"

预打印:

分页  <br style="page-break-after: always;" />

打印时不显示

<style>
@media print {
  .noprint {
  display: none
  }
}
</style>

<tr align="center" class="noprint">

点击文字可以选中相应的checkbox  :

<input id="check1" name="tag" type="checkbox" value="长发"/><label for="check1">长发</label>

图片居中:

img{ display:block; margin:0 auto;}

优先级:

.style1{
 color: #5a5100 !important;
 text-decoration: none;
}

CSS备忘的更多相关文章

  1. Css 备忘知识点

    1.Chrome 中文界面下默认会将小于 12px 的文本强制按照 12px 显示,可通过加入 CSS 属性 -webkit-text-size-adjust: none; 2.HTML5的form如 ...

  2. CSS备忘笔记

    一.CSS的概念 CSS(Cascading Style Sheet),中文译为层叠样式表,它是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言. 二.CSS使用方式 使用CSS控制页面 ...

  3. CSS备忘-1

    CSS 可以通过以下方式添加到HTML中: 内联样式- 在HTML元素中使用"style" 属性 内部样式表 -在HTML文档头部 <head> 区域使用<sty ...

  4. 常用CSS备忘

    1 怎样让div中的img居中 水平居中:div设置:text-align:center; img设置:width:图片宽度; margin:0 auto; 垂直居中:div设置:position:r ...

  5. [CSS备忘] css3零散

    -webkit-overflow-scrolling:touch;下拉滚动回弹

  6. [CSS备忘]改变选中文本的颜色::selection

    /*Webkit,Opera9.5+,IE9+*/ ::selection { background:red; color:white; } /*Firefox*/ ::-moz-selection ...

  7. [CSS备忘]多行文本省略号

    overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box ...

  8. CSS 备忘

    border-radius :  10px  /  40px    10表示X轴半径   40表示Y轴半径   font:italic bold 13px/13px arial,sans-serif; ...

  9. CSS系列:less备忘

    less备忘 //这是一个运行在koala中的less文件,//注释不会被编译到css文件中,/**/注释会 ****************by 李可 2016/04/19 /*所有,所有伪类*/ ...

随机推荐

  1. poj 2891 扩展欧几里得迭代解同余方程组

    Reference: http://www.cnblogs.com/ka200812/archive/2011/09/02/2164404.html 之前说过中国剩余定理传统解法的条件是m[i]两两互 ...

  2. TYVJ1038 忠诚

    hzw学长博客里的2048,根本停不下来! 描述 老管家是一个聪明能干的人.他为财主工作了整整10年,财主为了让自已账目更加清楚.要 求管家每天记k次账,由于管家聪明能干,因而管家总是让财主十分满意. ...

  3. java连接mysql(二)

    模拟转账成功时的业务场景 import java.sql.*; public class TransactionDemo1 { public static void main(String[] arg ...

  4. 最小圆覆盖(Smallest Enclosing Discs)

    随机增量算法(a randomized incremental algorithm) #define sqr(x) ((x)*(x)) #define EPS 1e-4 struct P{ doubl ...

  5. [Angularjs]ng-class,ng-class-even,ng-class-odd

    写在前面 最近在通过angularjs将数据绑定到前端,其中也涉及到很多新的东西,一些效果还是很有必要实现的.在使用中发现ng-class,ng-class-even.ng-class-odd的使用, ...

  6. thinkphp开发规范

    1.编写目的     为了更好的提高技术部的工作效率,保证开发的有效性和合理性,并可最大程度的提高程序代码的可读性和可重复利用性,指定此规范.开发团队根据自己的实际情况,可以对本规范进行补充或裁减. ...

  7. --hdu 1050 Moving Tables(贪心)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1050 AC code: #include<stdio.h> #include<str ...

  8. struts+spring action应配置为scope="prototype"

    truts+spring action应配置为scope="prototype" <bean id="personAction" scope=" ...

  9. linux kill信号列表

    linux kill信号列表 $ kill -l1) SIGHUP       2) SIGINT       3) SIGQUIT      4) SIGILL5) SIGTRAP      6) ...

  10. wes开发笔记

    html中的button和submit有什么不同? submit是提交表单用,而button是执行javascript用,两者各有用处. 用到自己写按钮的时候,都是用button,submit很少写 ...