css中一些必要的公共样式
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin:0; padding:0; }
body, button, input, select, textarea { font:12px Arial, Tahoma, 宋体; color:#454545; }
button, input, select, textarea, h1, h2, h3, h4, h5, h6 { font-size:100%; }
h2, h3 { font-size:14px; }
button, input, select, textarea, label { vertical-align:middle; outline:none; }
img { vertical-align:middle; border:none; display:inline-block; background:#fff url(/images/common/nopic.png) center no-repeat; }
ul, ol { list-style:none; }
a { text-decoration:none; color:#454545; vertical-align:baseline; cursor:pointer; }
a:hover { text-decoration:underline; color:#000; }
table { border-collapse:collapse; border-spacing:0; }
body { word-wrap:break-word; word-break:break-all; _height:100%; }
/*输入框*/
.g-txt { height:23px; line-height:23px; border-width:1px; border-style:solid; border-color:#454545 #ccc #ccc #454545; padding-left:3px; }
.g-txt:hover, .g-txt.focus { background-color:#fffcc5; }
/*--------------*/
/*--------------*/
/*单项公共样式开始*/
/*--------------*/
/*--------------*/
/*顶底边框*/
.g-bt-n { border-top:none !important; }
.g-bb-n { border-bottom:none !important; }
.g-b-dd { border:1px solid #dddddd; }
/*背景色*/
.g-bc-w { background-color:#fff }
.g-bi-n { background-image:none !important; }
/*字体灰色*/
.g-c-22 { color:#222; }
.g-c-33 { color:#333; }
.g-c-66 { color:#666; }
.g-c-99 { color:#999; }
/*字体白色*/
.g-c-w { color:#fff; }
/*字体红色*/
.g-c-r { color:#e25150; }
/*绿色*/
.g-c-green { color:#579719; }
/*清浮*/
.g-cf:after { content:""; clear:both; display:table; }
.g-cf { zoom:1; }
/*浮动*/
.g-f-l { float:left !important; _display:inline; }
.g-f-r { float:right !important; _display:inline; }
/*显示隐藏*/
.g-d-n { display:none; }
.g-d-b { display:block; }
.g-d-i { display:inline; }
.g-d-ib { display:inline-block; }
.g-v-h { visibility:hidden; }
.g-v-v { visibility:visible; }
/*字体宋体*/
.g-ff-s { font-family:宋体; }
/*字体风格*/
.g-fs-n { font-style:normal; }
/*字体加粗*/
.g-fw-b { font-weight:bold; }
.g-fw-n { font-weight:normal; }
/*字体大小*/
.g-fz-18 { font-size:18px; }
.g-fz-16 { font-size:16px; }
.g-fz-15 { font-size:15px; }
.g-fz-14 { font-size:14px; }
.g-fz-12 { font-size:12px; }
/*高、行高*/
.g-h-a { height:auto !important; }
.g-lh-18 { line-height:18px !important; }
.g-h-22 { height:22px !important; }
.g-lh-22 { line-height:22px !important; }
.g-h-24 { height:24px !important; }
.g-lh-24 { line-height:24px !important; }
.g-h-25 { height:25px !important; }
.g-lh-25 { line-height:25px !important; }
.g-lh-30 { line-height:30px !important; }
/*最小高度*/
.g-mh-20 { min-height:20px; _height:20px; }
.g-mh-50 { min-height:50px; _height:50px; }
/*外边距*/
.g-mlr-a { margin-left:auto; margin-right:auto; }
.g-m-10 { margin:10px; }
.g-mtb-10 { margin-top:10px; margin-bottom:10px; }
.g-mlr-10 { margin-left:10px; margin-right:10px; }
.g-mt-10 { margin-top:10px; }
.g-mb-10 { margin-bottom:10px; }
.g-ml-10 { margin-left:10px; }
.g-mr-10 { margin-right:10px; }
.g-m-5 { margin:5px; }
.g-mtb-5 { margin-top:5px; margin-bottom:5px; }
.g-mlr-5 { margin-left:5px; margin-right:5px; }
.g-mt-5 { margin-top:5px !important; }
.g-mb-5 { margin-bottom:5px !important; }
.g-ml-5 { margin-left:5px !important; }
.g-mr-5 { margin-right:5px !important; }
.g-mt-n { margin-top:0 !important; }
.g-mb-n { margin-bottom:0 !important; }
.g-ml-n { margin-left:0 !important; }
.g-mr-n { margin-right:0 !important; }
/*内边距*/
.g-p-10 { padding:10px; }
.g-ptb-10 { padding-top:10px; padding-bottom:10px; }
.g-plr-10 { padding-left:10px; padding-right:10px; }
.g-pt-10 { padding-top:10px; }
.g-pb-10 { padding-bottom:10px; }
.g-pl-10 { padding-left:10px; }
.g-pr-10 { padding-right:10px; }
.g-p-5 { padding:5px; }
.g-ptb-5 { padding-top:5px; padding-bottom:5px; }
.g-plr-5 { padding-left:5px; padding-right:5px; }
.g-pt-5 { padding-top:5px !important; }
.g-pb-5 { padding-bottom:5px !important; }
.g-pl-5 { padding-left:5px !important; }
.g-pr-5 { padding-right:5px !important; }
.g-pt-n { padding-top:0 !important; }
.g-pb-n { padding-bottom:0 !important; }
.g-pl-n { padding-left:0 !important; }
.g-pr-n { padding-right:0 !important; }
.g-pt-20 { padding-top:20px !important; }
/*overflow*/
.g-o-h { overflow:hidden !important; }
.g-o-a { overflow:auto !important; }
.g-o-v { overflow:visible!important; }
/*相对定位*/
.g-p-r { position:relative; }
/*水平右中左*/
.g-ta-r { text-align:right !important; }
.g-ta-c { text-align:center !important; }
.g-ta-l { text-align:left !important; }
/*垂直上中下*/
.g-va-t { vertical-align:top !important; }
.g-va-m { vertical-align:middle !important; }
.g-va-b { vertical-align:bottom !important; }
.g-va-bl { vertical-align:baseline !important; }
/*缩进*/
.g-ti-1 { text-indent:1em; }
.g-ti-2 { text-indent:2em; }
.g-ti-3 { text-indent:3em; }
.g-ti-4 { text-indent:4em; }
.g-ti-5 { text-indent:5em; }
/*下划线*/
.g-td-n { text-decoration:none !important; }
/*强制不换行*/
.g-ws-w { white-space:nowrap; }
/*强制换行*/
.g-ww-bw { white-space:normal; word-wrap:break-word; word-break:break-all; }
转载于:https://www.cnblogs.com/yueyue-love/p/6093500.html
css中一些必要的公共样式相关推荐
- CSS中定义多个链接样式,在CSS中定义【导航栏】超链接样式
1.案例css代码 .divcss5 a:link{ color:#F00}/* 链接默认为红色 */ .divcss5 a:hover{ color:#000}/* 鼠标悬停黑色 */ .divcs ...
- css中如何设置hr的样式?css hr标签多种样式(图文)
在对html网页进行美化的时候,肯定少不了要用的hr标签进行修饰页面,但默认的hr标签样式对页面的修饰起不到什么好的作用,有经验的前端工作者就会通过使用css样式来对hr标签进行一些美化的操作.那么如 ...
- CSS中已经定义宽度的样式 英文不执行换行
CSS中已经定义了最大宽度的样式 可是 英文不会换行 在编写一个聊天项目时 CSS中已经定义了最大宽度的样式 汉字会自动换行 可是 英文不会换行 原因:认为作为一个英语单词不换行 解决方案: 在CSS ...
- css实例 css中id/class 详解样式表(外部样式表 内部样式表 内联样式 7种基础选择器 多重样式优先级 错误理解)[第一天]
文章目录 css实例 css中的id css中的class 样式表 外部样式表 内部样式表 内联样式 7种基础选择器 多重样式优先级 错误理解 css实例 CSS 规则由两个主要的部分构成:选择器,以 ...
- css中定义超级链接的样式
CSS中用四个伪类来定义链接的样式,分别是:a:link.a:visited.a:hover和a : active,例如: a:link{font-weight : bold ;text-decora ...
- CSS中hover改变其他元素样式
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <m ...
- css链接样式_如何在CSS中设置链接样式
css链接样式 样式链接 (Styling Links) Links can be styled with any CSS property, such as color, font-family, ...
- html中基本选择器的优先级,CSS_CSS中的各种选择器与样式优先级小结,优先级:由高到低(从上到下)- phpStudy...
CSS中的各种选择器与样式优先级小结 优先级:由高到低(从上到下) !important 内联(1,0,0,0) id: (0,1,0,0) 类:(0,0,1,0) 伪类/属性 元素:(0,0,0,1 ...
- 【转】在CSS中 ID与Class的区别?谢谢
在样式表定义一个样式的时候,可以定义id也可以定义class.1.在CSS文件里书写时,ID加前缀"#":CLASS用"."2.id一个页面只可以使用一次:cl ...
最新文章
- 数据结构树的基本操作_《数据结构》树的基本操作.doc
- android settings源代码分析(2)
- E20170626-gg
- [BZOJ2458][BeiJing2011]最小三角形
- rowmapper_Spring Integration Jdbc RowMapper示例
- 从C语言过渡到C++并不容易啊,大家说呢?
- 并发、并行、线程、进程与CPU基本概念
- HTML5清爽博客自媒体网站模板
- django Form表单验证
- I00010 打印1到输入数之间的回文数
- oracle的三种系统文件,Oracle中三种上载文件技术
- 服务器后台自动运行程序和停止
- python click 函数
- React Native手动实现调用原生相机相册(Android端)
- 关于区块链在存证方面的应用
- AD域控的搭建与加入AD域
- 汉字转16进制 php,PHP实现中文汉字与16进制编码转换
- 将“360软件小助手添加到“快速启动栏”
- 如何激励你的内容团队产出更好的创意
- 适合新手看的安卓开发书android studio