CSS备忘
垂直居中:
先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备忘的更多相关文章
- Css 备忘知识点
1.Chrome 中文界面下默认会将小于 12px 的文本强制按照 12px 显示,可通过加入 CSS 属性 -webkit-text-size-adjust: none; 2.HTML5的form如 ...
- CSS备忘笔记
一.CSS的概念 CSS(Cascading Style Sheet),中文译为层叠样式表,它是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言. 二.CSS使用方式 使用CSS控制页面 ...
- CSS备忘-1
CSS 可以通过以下方式添加到HTML中: 内联样式- 在HTML元素中使用"style" 属性 内部样式表 -在HTML文档头部 <head> 区域使用<sty ...
- 常用CSS备忘
1 怎样让div中的img居中 水平居中:div设置:text-align:center; img设置:width:图片宽度; margin:0 auto; 垂直居中:div设置:position:r ...
- [CSS备忘] css3零散
-webkit-overflow-scrolling:touch;下拉滚动回弹
- [CSS备忘]改变选中文本的颜色::selection
/*Webkit,Opera9.5+,IE9+*/ ::selection { background:red; color:white; } /*Firefox*/ ::-moz-selection ...
- [CSS备忘]多行文本省略号
overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box ...
- CSS 备忘
border-radius : 10px / 40px 10表示X轴半径 40表示Y轴半径 font:italic bold 13px/13px arial,sans-serif; ...
- CSS系列:less备忘
less备忘 //这是一个运行在koala中的less文件,//注释不会被编译到css文件中,/**/注释会 ****************by 李可 2016/04/19 /*所有,所有伪类*/ ...
随机推荐
- poj 3734 矩阵快速幂+YY
题目原意:N个方块排成一列,每个方块可涂成红.蓝.绿.黄.问红方块和绿方块都是偶数的方案的个数. sol:找规律列递推式+矩阵快速幂 设已经染完了i个方块将要染第i+1个方块. a[i]=1-i方块中 ...
- Linux命令详解:[7]获得命令帮助
在维护和使用Linux系统时,常常会忘记命令的使用方法,如果旁边又没有相应的资料,那怎么办呢?不用担心,系统本身提供了详细的手册供使用者查询,下面小编就以CentOS6.4系统为例演示如何获得命令帮助 ...
- js中按钮控制显示隐藏以及下拉功能
<script> function show() { var a2=document.getElementById("div2"); if(a2.style.displ ...
- Oracle 11g ORA-00845: MEMORY_TARGET not supported on this system
启动Oracle 11gR2后报错:ORA-00845 rac1:/home/oracle> sqlplus / as sysdba; SQL*Plus: Release 11.2.0.3.0 ...
- 如何起草你的第一篇科研论文——应该做&避免做
如何起草你的第一篇科研论文——应该做&避免做 导语:1.本文是由Angel Borja博士所写.本文的原文链接在这里.感谢励德爱思唯尔科技的转载,和刘成林老师的转发.2.由于我第二次翻译,囿于 ...
- js正则表达式中的问号几种用法小结
这篇文章主要介绍了js正则表达式中的问号几种用法,比如+?,*?,{2,3}?可以停止匹配的贪婪模式,感兴趣的朋友可以参考下 在表示重复的字符后面加问号,比如+?,*?,{2,3}?可以停止匹配的贪婪 ...
- xss概念剖析
XSS又叫CSS (Cross-Site Scripting) ,跨站脚本攻击.恶意攻击者往Web页面里插入恶意html代码,当用户浏览该页之时,嵌入其中Web里面的html代码会被执行,从而达到恶意 ...
- JavaScript由单价、数量计算总价
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- .NET深入实战系列--EF到底怎么写过滤条件(转)
原文来自:http://www.cnblogs.com/yubaolee/p/DynamicLinq.html 对于系统开发来说,按不同字段进行过滤查询是一种常见的需求.在EF中通常的做法是: /// ...
- cocos基础教程(1)Mac环境下搭建
下面主要介绍cocos2d-x环境的设置以及android的环境搭建 1.下载cocos2d-x 3.0正式版 http://www.cocos2d-x.org/download 2.下载a ...