DIV+CSS颜色边框背景等样式
1.使用css缩写
使用缩写可以帮助减少你CSS文件的大小,更加容易阅读。css缩写的主要规则请参看《常用css缩写语法总结》,css缩写的主要规则如下:
颜色
16进制的色彩值,如果每两位的值相同,可以缩写一半,例如:
#000000可以缩写为#000;#336699可以缩写为#369;
注意:在同一个CSS配置节中,不要交错使用全写和缩写的颜色配置,在系统资源极低时,会导致浏览器渲染失败。
盒尺寸
通常有下面四种书写方法:
- property:value1; 表示所有边都是一个值value1;
- property:value1 value2; 表示top和bottom的值是value1,right和left的值是value2
- property:value1 value2 value3; 表示top的值是value1,right和left的值是value2,bottom的值是value3
- property:value1 value2 value3 value4; 四个值依次表示top,right,bottom,left
方便的记忆方法是顺时针,上右下左。具体应用在margin和padding的例子如下:
margin:1em 0 2em 0.5em;
边框(border)
边框的属性如下:
- border-width:1px;
- border-style:solid;
- border-color:#000;
可以缩写为一句:border:1px solid #000;
语法是border:width style color;
背景(Backgrounds)
背景的属性如下:
- background-image:url(background.gif);
- background-repeat:no-repeat;
- background-attachment:fixed;
- background-position:0 0;
可以缩写为一句:background:#f00 url(background.gif) no-repeat fixed 0 0;
语法是background:color image repeat attachment position;
你可以省略其中一个或多个属性值,如果省略,该属性值将用浏览器默认值,默认值为:
- color: transparent
- image: none
- repeat: repeat
- attachment: scroll
- position: 0% 0%
http://roucheng.cnblogs.com/
字体(fonts)
字体的属性如下:
- font-style:italic;
- font-variant:small-caps;
- font-weight:bold;
- font-size:1em;
- line-height:140%;
- font-family:"Lucida Grande",sans-serif;
可以缩写为一句:font:italic small-caps bold 1em/140% "Lucida Grande",sans-serif;
注意,如果你缩写字体定义,至少要定义font-size和font-family两个值。
列表(lists)
取消默认的圆点和序号可以这样写list-style:none;,
list的属性如下:
- list-style-type:square;
- list-style-position:inside;
- list-style-image:url(image.gif);
可以缩写为一句:list-style:square inside url(image.gif);
http://www.cnblogs.com/roucheng/p/3509733.html
转载于:https://www.cnblogs.com/roucheng/p/cssstyle.html
DIV+CSS颜色边框背景等样式相关推荐
- html背景样式代码,12种纯CSS实现的背景图案样式代码
这是使用纯css实现的背景图案样式,可以作用于任何元素甚至文本背景. 使用方法: 1使用NPM安装并下载pattern.css. 2导入pattern.css. 3.或在html文档中加载patter ...
- CSS 颜色 字体 背景 文本 边框 列表 display属性
1 颜色属性 <div style="color:blueviolet">ppppp</div><div style="color:#ff ...
- DIV+CSS虚线边框|CSS虚线下划线及虚线列表教程
DIV CSS虚线教程篇包括讲解常常出现的各种样式的DIV虚线案例CSS教程. 本节为大家介绍常见的CSS 虚线及DIV教程.CSS虚线下划线.列表虚线统统搞定. 目录 CSS虚线边框 CSS超链接虚 ...
- css背景上能添加文字,如何利用div+css来给背景图片上文字布局
这段时间设计了一个专题页面,上传到网站上去,打开这个网页一看,问题来了,这网页只是一个图片,没有文字,在后台添加的时候才知道只能在图片的下面显示文字. 我想到了可以将图片设为背景,然后在上面添加问题, ...
- html图片如何全部展示整个页面,div+css如何控制背景图片全显示出来??
扬帆大鱼 可以使用:Background-size属性语法:background-size :[ | | auto ]{1,2} | cover | contain取值::由浮点数字和单位标识符组 ...
- DIV+CSS虚线边框
这里通过边框属性的虚线边框border控制虚线.以下设置的css 高度(css height)和css 宽度(css width)为350像素是为了便于观看演示 其它意思. 一.四边为虚线边框 bor ...
- php 验证码提交按钮样式,修改thinkphp验证码样式(颜色边框背景)
做网站,常常需要自定义一些自己喜欢的颜色背景样式,验证码也不例外. Thinkphp 默认验证码是白色调为主的.在比较暗色调的网站上非常的显眼不好看,于是 我这里和大家说一下如何修改 首先找到Thin ...
- web前端入门到实战:CSS颜色、背景和剪切
颜色 CSS 中可以改变文字的颜色还有元素的背景颜色.可以用颜色关键字来定义颜色,如red,但是这些颜色关键字并不常用. transparent transparent可以让文字或背景变的完全透明的颜 ...
- html添加背景图片并且填满div,css background-size与背景图片填满div(示例代码)
background-size与背景图片填满div 在开发中,常有需要将一张图片作为一个div的背景图片充满div的需求 background-size的取值及解释 background-size共有 ...
最新文章
- python以运行效率高著称吗_如何提高python的运行效率
- Docker selenium自动化 - Python调用容器实例跑自动化查天气实例演示,docker selenium自动化环境部署过程
- ie浏览器 杂项样式错乱
- 分组交换中的时延、丢失和吞吐量
- java颜色gui_Java gui颜色不加载
- 测试工程师不懂AI,还有未来吗?
- VS2005(C#)里读取及改变App.config里appSettings节的值
- Redis的过期键删除策略和内存淘汰机制
- 单结晶体管的导电特性_适用于印刷电子的导电墨水可在纸和PET薄膜上印刷薄膜晶体管...
- Flink SQL 实战:HBase 的结合应用
- 【MAC】手动下载安装docker
- 51单片机流水灯三种实现方法
- 什么是3d建模,3D建模师可以从事哪些职业?
- Oracle导出表结构(含表名、字段名、数据类型、是否为空、字段说明)至Excel(简单详细)sql语句的形式
- ICEM 准备工作-常用操作
- Windows下HdWiki安装步骤
- 项目运行时报错出现:因为在此系统上禁止运行脚本有关详细信息,请参阅 https。该如何解决
- try{}里有一个return语句,那么紧跟在这个try后的finally{}里的代码会不会被执行
- 如何从Linux下载一个文件到本地
- android 高仿美团,Android 仿美团、大众点评团购详情UI