摘抄的一些代码还有自己总结的常用的代码~

1>浏览器样式统一

 *{
margin:0px;
padding:0px;

浏览器样式统一

2>清除浮动的方法

3>跨浏览器设置透明度

 .transparent{
filter:alpha(opacity=50); /*IE*/
-khtml-opacity:0.5; /*老版本的Safari*/
-moz-opacity:0.5; /*Mozilla,Netscape*/
opacity:0.5; /*fx,Safari,Opera*/
}

跨浏览器设置透明度

4>设置圆角

 .circle{
-webkit-border-radius:4px 2px 5px 10px;
-moz-border-radius:4px 2px 5px 10px;
-ms-border-radius:4px 2px 5px 10px;
-o-border-radius:4px 2px 5px 10px;
border-radius:4px 2px 5px 10px;

设置圆角

5>CSS字体属性简写(缩写)

 .title{
font:font-style font-variant font-weight font-size line-height font-family
}

CSS字体属性简写(缩写)

6>强制垂直滚动条

 html{height:101%}

强制垂直滚动条

7>设置自定义字体

 @font-face{
font-family:'calamus';
src:url('pictos/calamus.eot'); /* IE9 */
src:url('pictos/calamus.eot') format('embedded-opentype'),/*IE6-IE8*/
url('pictos/calamus.ttf') format('truetype'),/*Safari,Android,IOS*/
url('pictos/calamus.woff') format('woff),/*Modern Browers*/
url('pictos/calamus.svg') format('svg');/*Legacy IOS*/
}
body{
font-family:'calamus';
}

设置自定义字体

8>文本对齐方式

 .content{
text-align:center; /*把文本排列到中间。*/
text-align:left; /*把文本排列到左边。默认值:由浏览器决定。*/
text-align:right; /*把文本排列到右边。*/
text-align:justify; /*实现两端对齐文本效果。*/
text-align:inherit ; /*规定应该从父元素继承 text-align 属性的值。*/
}

文本对齐

9>垂直居中内容

 .content{
min-height:6.5em;
display:table-cell;
vertical-align:middle;
}

垂直居中内容

10>固定宽度的局中布局

 .page{
width:800px;
margin:0 auto;
}

固定宽度的局中布局

11>CSS3斑马条纹

 tbody tr:nth-child(odd){
background-color:#ccc;
}

CSS3斑马条纹

12>图片自适应大小

 .logo{
background-image:url('img/calamus.jpg');
background-size:100%;
width:100%;
padding-top:30%;
height:;
text-indent:-9999px;
}

CSS实用的代码段的更多相关文章

  1. 50个必备的实用jQuery代码段+ 可以直接拿来用的15个jQuery代码片段

    50个必备的实用jQuery代码段+ 可以直接拿来用的15个jQuery代码片段 本文会给你们展示50个jquery代码片段,这些代码能够给你的javascript项目提供帮助.其中的一些代码段是从j ...

  2. 50个必备的实用jQuery代码段

    本文会给你们展示50个jquery代码片段,这些代码能够给你的javascript项目提供帮助.其中的一些代码段是从jQuery1.4.2才开始支持的做法,另一些则是真正有用的函数或方法,他们能够帮助 ...

  3. 50个必备的实用jQuery代码段(转载)

    本文会给你们展示50个jquery代码片段,这些代码能够给你的javascript项目提供帮助.其中的一些代码段是从jQuery1.4.2才开始支持的做法,另一些则是真正有用的函数或方法,他们能够帮助 ...

  4. 45个必备的实用jQuery代码段[转载]

    1. 如何创建嵌套的过滤器: //允许你减少集合中的匹配元素的过滤器, //只剩下那些与给定的选择器匹配的部分.在这种情况下, //查询删除了任何没(:not)有(:has) //包含class为“s ...

  5. 50个必备的实用jQuery代码段(转)

    1. 如何创建嵌套的过滤器: //允许你减少集合中的匹配元素的过滤器, //只剩下那些与给定的选择器匹配的部分.在这种情况下, //查询删除了任何没(:not)有(:has) //包含class为“s ...

  6. N个必备的实用jQuery代码段

    jQuery(function() { /* <input type="password" name="pass" id="pass" ...

  7. JQuery--50个必备的实用jQuery代码段.

    原文出处:http://my.oschina.net/chengjiansunboy/blog/55496?p=2#comments 1. 如何修改jQuery默认编码(例如默认UTF-8改成改GB2 ...

  8. 前端用户体验优化: JS & CSS 各类效果代码段

    前言 不定时更新 在线预览 https://zzyper.github.io/opti... 在线预览的源码 https://github.com/zzyper/opt... 部分内容仅兼容webki ...

  9. 必备的实用jQuery代码段(1)

    1. 如何正确地使用toggleClass: //切换(toggle)类允许你根据某个类的 //是否存在来添加或是删除该类. //这种情况下有些开发者使用: a.hasClass('blueButto ...

随机推荐

  1. HashMap的实现

    HashMap的工作原理是近年来常见的Java面试题.几乎每个Java程序员都知道HashMap,都知道哪里要用HashMap,知道Hashtable和HashMap之间的区别,那么为何这道面试题如此 ...

  2. __VA_ARGS__用法(转)

    自定义调试信息的输出 调试信息的输出方法有很多种,  例如直接用printf,  或者出错时使用perror, fprintf等将信息直接打印到终端上, 在Qt上面一般使用qDebug,而守护进程则一 ...

  3. SparkStreaming入门及例子

    看书大概了解了下Streaming的原理,但是木有动过手啊...万事开头难啊,一个wordcount 2小时怎么都运行不出结果.是我太蠢了,好了言归正传. SparkStreaming是一个批处理的流 ...

  4. BIP_开发案例07_将原有Report Builer报表全部转为XML Publisher形式(案例)

    2014-05-31 Created By BaoXinjian

  5. Codeforces Round #356 (Div. 2) C. Bear and Prime 100(转)

    C. Bear and Prime 100 time limit per test 1 second memory limit per test 256 megabytes input standar ...

  6. python (10) 文件夹的创建与文件夹的删除

    有时需要在代码中对文件或者文件夹 进行删除,或者添加 导入的包:import os,shutil 新建文件夹 import os,shutil path = os.getcwd() #获得当前目录 # ...

  7. REDHAT6.2配置yum源(64位)(转载)

    From:http://www.dedecms8.com/db/php_bc/12322.html 1.删除redhat原有的yum rpm -aq|grep yum|xargs rpm -e --n ...

  8. ubuntu 允许端口被连接

    iptables -I INPUT -p tcp --dport 3306 -j ACCEPT  推荐一个自己业余时间开发的网盘搜索引擎,360盘搜(www.360panso.com)

  9. [SQL]把同一字段里的多行数据用一行显示

    declare @t table(id int,num int) insert @t , union all , union all , --select * from @t ----查询 decla ...

  10. [SQL]SQL语言入门级教材_SQL数据操作基础(二)

    SQL数据操作基础(初级) netnova 于 -- :: 加贴在 数据库探讨: 为了建立交互站点,你需要使用数据库来存储来自访问者的信息.例如,你要建立一个职业介绍服务的站点,你就需要存储诸如个人简 ...