CSS实用的代码段
摘抄的一些代码还有自己总结的常用的代码~
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实用的代码段的更多相关文章
- 50个必备的实用jQuery代码段+ 可以直接拿来用的15个jQuery代码片段
50个必备的实用jQuery代码段+ 可以直接拿来用的15个jQuery代码片段 本文会给你们展示50个jquery代码片段,这些代码能够给你的javascript项目提供帮助.其中的一些代码段是从j ...
- 50个必备的实用jQuery代码段
本文会给你们展示50个jquery代码片段,这些代码能够给你的javascript项目提供帮助.其中的一些代码段是从jQuery1.4.2才开始支持的做法,另一些则是真正有用的函数或方法,他们能够帮助 ...
- 50个必备的实用jQuery代码段(转载)
本文会给你们展示50个jquery代码片段,这些代码能够给你的javascript项目提供帮助.其中的一些代码段是从jQuery1.4.2才开始支持的做法,另一些则是真正有用的函数或方法,他们能够帮助 ...
- 45个必备的实用jQuery代码段[转载]
1. 如何创建嵌套的过滤器: //允许你减少集合中的匹配元素的过滤器, //只剩下那些与给定的选择器匹配的部分.在这种情况下, //查询删除了任何没(:not)有(:has) //包含class为“s ...
- 50个必备的实用jQuery代码段(转)
1. 如何创建嵌套的过滤器: //允许你减少集合中的匹配元素的过滤器, //只剩下那些与给定的选择器匹配的部分.在这种情况下, //查询删除了任何没(:not)有(:has) //包含class为“s ...
- N个必备的实用jQuery代码段
jQuery(function() { /* <input type="password" name="pass" id="pass" ...
- JQuery--50个必备的实用jQuery代码段.
原文出处:http://my.oschina.net/chengjiansunboy/blog/55496?p=2#comments 1. 如何修改jQuery默认编码(例如默认UTF-8改成改GB2 ...
- 前端用户体验优化: JS & CSS 各类效果代码段
前言 不定时更新 在线预览 https://zzyper.github.io/opti... 在线预览的源码 https://github.com/zzyper/opt... 部分内容仅兼容webki ...
- 必备的实用jQuery代码段(1)
1. 如何正确地使用toggleClass: //切换(toggle)类允许你根据某个类的 //是否存在来添加或是删除该类. //这种情况下有些开发者使用: a.hasClass('blueButto ...
随机推荐
- HashMap的实现
HashMap的工作原理是近年来常见的Java面试题.几乎每个Java程序员都知道HashMap,都知道哪里要用HashMap,知道Hashtable和HashMap之间的区别,那么为何这道面试题如此 ...
- __VA_ARGS__用法(转)
自定义调试信息的输出 调试信息的输出方法有很多种, 例如直接用printf, 或者出错时使用perror, fprintf等将信息直接打印到终端上, 在Qt上面一般使用qDebug,而守护进程则一 ...
- SparkStreaming入门及例子
看书大概了解了下Streaming的原理,但是木有动过手啊...万事开头难啊,一个wordcount 2小时怎么都运行不出结果.是我太蠢了,好了言归正传. SparkStreaming是一个批处理的流 ...
- BIP_开发案例07_将原有Report Builer报表全部转为XML Publisher形式(案例)
2014-05-31 Created By BaoXinjian
- 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 ...
- python (10) 文件夹的创建与文件夹的删除
有时需要在代码中对文件或者文件夹 进行删除,或者添加 导入的包:import os,shutil 新建文件夹 import os,shutil path = os.getcwd() #获得当前目录 # ...
- 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 ...
- ubuntu 允许端口被连接
iptables -I INPUT -p tcp --dport 3306 -j ACCEPT 推荐一个自己业余时间开发的网盘搜索引擎,360盘搜(www.360panso.com)
- [SQL]把同一字段里的多行数据用一行显示
declare @t table(id int,num int) insert @t , union all , union all , --select * from @t ----查询 decla ...
- [SQL]SQL语言入门级教材_SQL数据操作基础(二)
SQL数据操作基础(初级) netnova 于 -- :: 加贴在 数据库探讨: 为了建立交互站点,你需要使用数据库来存储来自访问者的信息.例如,你要建立一个职业介绍服务的站点,你就需要存储诸如个人简 ...