css样式清零及常用类
css样式清零及常用类
/* css样式清零及常用类 */ @charset "utf-8";
/*CSS Reset*/
/*"微软雅黑","\5FAE\8F6F\96C5\9ED1","Microsoft YaHei"
"黑体","\9ED1\4F53"
"新宋体","\65B0\5B8B\4F53"
"宋体","\5B8B\4F53"
"幼圆" ,"YouYuan","\5E7C\5706"
*/
*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;word-wrap:break-all}:before,:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
body{min-height:100%;background-color:#fff;-webkit-font-26oothing:antialiased;-moz-osx-font-26oothing:grayscale;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}
body{font-family:Arial,'微软雅黑',"\5FAE\8F6F\96C5\9ED1","Microsoft Yahei","simsun","\5B8B\4F53","宋体","\65B0\5B8B\4F53","新宋体";font-size:14px;color: #444;}
html,body,h1,h2,h3,h4,h5,h6,dl,dt,dd,ul,ol,li,hr,p,pre,span,strong,form,iframe,label,button,input,textarea,table,tr,th,td,fieldset,i{margin:;padding:;text-align:left}
dl,dd,ol,ul,li{list-style:none;list-style-type:none}
div{text-align:left;margin-left:auto;margin-right:auto}
i{display:inline-block;font-style:normal;font-weight:normal;text-align:center;vertical-align:middle}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:}
a,a:link,a:visited,a:hover,a:active,a:focus,input,button,textarea,select,optgroup,option,a:focus,input:focus,button:focus,textarea:focus,select:focus,optgroup:focus,option:focus,label,label:focus{outline:none;text-decoration:none;-webkit-tap-highlight-color:rgba(255,0,0,0);-webkit-appearance: none;}
img{width:100%;border:;vertical-align:middle}a img,img{-ms-interpolation-mode:bicubic}
a,a:link,a:visited{color:#333333;cursor:pointer}
a:hover,a:active{text-decoration:underline}a.ie6:hover{zoom:}
button::-moz-focus-inner,input::-moz-focus-inner{padding:;border:}
input,button,textarea,select,optgroup,option{border:;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;line-height:inherit;overflow:visible;vertical-align:middle;outline:none;border-radius:;}
select {appearance:none;-moz-appearance:none;-webkit-appearance:none}select::-ms-expand { display: none; }select[multiple],select[size]{height:auto}
textarea{overflow-y:auto}
hr{height:;margin:15px 0;border:;border-top:1px solid #eee;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}
b,strong{font-weight:}
sub,sup{position:relative;font-size:75%;line-height:;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}
table{border-spacing:;border-collapse:collapse}
header,footer,section,aside,article,main,nav,menu,details,summary,address,hgroup,figure,figcaption,legend{display:block;margin:;padding:}
audio,canvas,progress,video{display:inline-block;*display:inline;*zoom:}
audio:not([controls]){display:none;height:}
legend{width:100%;margin-bottom:20px;font-size:21px;line-height:40px;border:;border-bottom:1px solid #e5e5e5}
time{display:inline}
svg:not(:root){overflow:hidden}
fieldset{padding:0.35em 0.625em 0.75em;margin:0 2px;border:1px solid #c0c0c0}
address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:}
[hidden],template{display:none}
abbr[title]{border-bottom:1px dotted}
dfn{font-style:italic}
mark{color:#000;background:#ff0}
small{font-size:80%}
figure{margin:1em 40px}
pre{overflow:auto}
code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}
/*通用属性*/ /*清除浮动*/
.clearfix{*zoom:;} /*解决ie6/7下面的浮动塌陷问题*/
.clearfix:before,
.clearfix:after{display:table; line-height:; content:" ";} /*display:table;解决其他下面的浮动塌陷问题,line-height是将添加的内容高度设为0;*/
.clearfix:after{clear: both;}/*清楚浮动*/
.fl{float:left;}.fr{float:right;} /*
弹性布局
*/
.flex{display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
/* ============================================================
flex:定义布局为盒模型
flex-v:盒模型垂直布局
flex-1:子元素占据剩余的空间
flex-align-center:子元素垂直居中
flex-pack-center:子元素水平居中
flex-pack-justify:子元素两端对齐
兼容性:ios 4+、android 2.3+、winphone8+
============================================================ */
.flex-v{-webkit-box-orient:vertical;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}
.flex-1{-webkit-box-flex:;-webkit-flex:;-ms-flex:;flex:;}
.flex-align-center{-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;}
.flex-pack-center{-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;}
.flex-pack-justify{-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;}
/*边距*/ .p0{padding:0px;}.p5{padding:5px;}.p10{padding:10px;}.p15{padding:15px;}.p20{padding:20px;}.p25{padding:25px;}.p30{padding:30px;}.p35{padding:35px;}.p40{padding:40px;} .pt0{padding-top:0px;}.pt5{padding-top:5px;}.pt10{padding-top:10px;}.pt15{padding-top:15px;}.pt20{padding-top:20px;}.pt25{padding-top:25px;}.pt30{padding-top:30px;}.pt35{padding-top:35px;}.pt40{padding-top:40px;} .pr0{padding-right:0px;}.pr5{padding-right:5px;}.pr10{padding-right:10px;}.pr15{padding-right:15px;}.pr20{padding-right:20px;}.pr25{padding-right:25px;}.pr30{padding-right:30px;}.pr35{padding-right:35px;}.pr40{padding-right:40px;} .pb0{padding-bottom:0px;}.pb5{padding-bottom:5px;}.pb10{padding-bottom:10px;}.pb15{padding-bottom:15px;}.pb20{padding-bottom:20px;}.pb25{padding-bottom:25px;}.pb30{padding-bottom:30px;}.pb35{padding-bottom:35px;}.pb40{padding-bottom:40px;} .pl0{padding-left:0px;}.pl5{padding-left:5px;}.pl10{padding-left:10px;}.pl15{padding-left:15px;}.pl20{padding-left:20px;}.pl25{padding-left:25px;}.pl30{padding-left:30px;}.pl35{padding-left:35px;}.pl40{padding-left:40px;} .mt0{margin-top:0px;}.mt5{margin-top:5px;}.mt10{margin-top:10px;}.mt15{margin-top:15px;}.mt20{margin-top:20px;}.mt25{margin-top:25px;}.mt30{margin-top:30px;}.mt35{margin-top:35px;}.mt40{margin-top:40px;} .mr0{margin-right:0px;}.mr5{margin-right:5px;}.mr10{margin-right:10px;}.mr15{margin-right:15px;}.mr20{margin-right:20px;}.mr25{margin-right:25px;}.mr30{margin-right:30px;}.mr35{margin-right:35px;}.mr40{margin-right:40px;} .mb0{margin-bottom:0px;}.mb5{margin-bottom:5px;}.mb10{margin-bottom:10px;}.mb15{margin-bottom:15px;}.mb20{margin-bottom:20px;}.mb25{margin-bottom:25px;}.mb30{margin-bottom:30px;}.mb35{margin-bottom:35px;}.mb40{margin-bottom:40px;} .ml0{margin-left:0px;}.ml5{margin-left:5px;}.ml10{margin-left:10px;}.ml15{margin-left:15px;}.ml20{margin-left:20px;}.ml25{margin-left:25px;}.ml30{margin-left:30px;}.ml35{margin-left:35px;}.ml40{margin-left:40px;}
css样式清零及常用类的更多相关文章
- CSS样式链接和文字常用属性
行内: <div style="color:red;"></div> 内嵌<style>div{background-color:red;}&l ...
- bootstrap 全局 CSS 样式
http://v3.bootcss.com/css/#less-mixins-utility 深入了解 Bootstrap 底层结构的关键部分,包括我们让 web 开发变得更好.更快.更强壮的最佳实践 ...
- 【03】全局 CSS 样式
全局 CSS 样式 设置全局 CSS 样式:基本的 HTML 元素均可以通过 class 设置样式并得到增强效果:还有先进的栅格系统. 概览 深入了解 Bootstrap 底层结构的关键部分,包括我们 ...
- 原生js更改css样式的两种方式
下面我给大家介绍的是原生js更改CSS样式的两种方式: 1通过在javascript代码中的node.style.cssText="css表达式1:css表达式2:css表达式3 &quo ...
- 【javascript】原生js更改css样式的两种方式
下面我给大家介绍的是原生js更改CSS样式的两种方式: 1通过在javascript代码中的node.style.cssText="css表达式1:css表达式2:css表达式3 &quo ...
- bootstrap全局css样式
以下从官网抄来的,感觉还是很实用的,运用得好,灵活运用,非常方便快捷,能大大提高开发效率,也为调整不同尺寸的屏幕节省了时间. hidden-xs @media (max-width: 767px){ ...
- 常用css样式(布局)
兼容css3新属性 在css3中,我们可以使用prefixfree.min.js这个插件来自动为css3的相关属性加上兼容浏览器属性,使我们不用为每个css3新属性再加上属性(需要用到大量css3的项 ...
- 11种常用css样式之鼠标、列表和尺寸样式学习
鼠标cursor常见样式crosshair;/*十字形状*/cursor:pointer;/*小手形状*/cursor:wait;/*等待形状*/cursor:text;/*默认 文本形状*/curs ...
- Day 31:CSS选择器、常用CSS样式、盒子模型
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- PHP就业前景好不好一看便知,转行选择需谨慎!
随着互联网行业迎来新一波的热潮,更多的年轻人选择软件行业发展.由于互联网本身快速发展.不断创新的特点,决定了只有以快开发速度和低成本,才能赢得胜利,才能始终保持网站的领先性和吸引更多的网民. 互联网的 ...
- php使用rc4加密算法
/** * rc4加密算法,解密方法直接再一次加密就是解密 * @param [type] $data 要加密的数据 * @param [type] $pwd 加密使用的key * @retur ...
- sublime text 3.0新版本注册码
-– BEGIN LICENSE -– TwitterInc 200 User License EA7E-890007 1D77F72E 390CDD93 4DCBA022 FAF60790 61AA ...
- win10下Python3.6安装、配置以及pip安装包教程
0.目录 1.前言 2.安装python 3.使用pip下载.安装包 3.1 安装Scrapy 3.2 安装PyQt 3.3 同时安装多个包 3.4 pip的常用命令 1.前言 之前在电脑上安装了py ...
- pipelineDB初体验
官网:http://www.pipelinedb.com/ pipelineDB是基于postgres的stream数据库.完全兼容pg的东西. 由于产品需要解决性能这块瓶颈,老大让试试这款基于流计算 ...
- 大数据学习系列之五 ----- Hive整合HBase图文详解
引言 在上一篇 大数据学习系列之四 ----- Hadoop+Hive环境搭建图文详解(单机) 和之前的大数据学习系列之二 ----- HBase环境搭建(单机) 中成功搭建了Hive和HBase的环 ...
- vue项目的骨架及常用组件介绍
vue项目基础结构 一个vue的项目,我觉得最小的子集其实就是{vue,vue-router,component},vue作为基础库,为我们提供双向绑定等功能.vue-router连接不同的" ...
- UILabel 的使用
直接上代码: /* UILabel 使用 */ UILabel *aLable = [[UILabel alloc] initWithFrame:self.window.bounds]; aLable ...
- 《Qt on Android核心编程》介绍
<Qt on Android核心编程>最终尘埃落定.付梓印刷了. 2014-11-02更新:china-pub的预售链接出来了.折扣非常低哦. 封面 看看封面的效果吧,历经几版,最终就成了 ...
- JS排序
冒泡排序 https://sort.hust.cc/1.bubbleSort.html 选择排序 https://sort.hust.cc/2.selectionSort.html 插入排序 http ...