border
用emmet写border的时候, 缩写是:bd. 不是b, 也不是bdr: b会扩展成bottom, bdr 会扩展成 border-right,
border的宽度: 1px 基本上== thin, 很细的
border的全部样式一次性写完的固定写法是:
border: 宽度width + 样式style + 颜色colorborder属性中最重要的属性是 border-style: 是边框的样式, 因为 border-style的默认值是 :none. 是没有边框.
border 几个属性的默认值 是: border-width: medium, 大概2, 3个px. border-color: #000 是黑色. 而border-style不是没有默认值, 而是它的默认值是 border-style: none ,或者说是 border-style:0 所以如果你不指定 border-style的时候, 也是你不写border-style的时候, 是没有边框的!!
所以border样式属性的值, 你可以不写 width, 不写color, 但是一定要写 style.
border的属性值排序 正规的是按上面的那个 顺序, 但是如果你不按那个标准 顺序写, 也是可以 正确解析的..., 甚至你省略写, 只写某一个属性值, 都可以, 因为parser 是能够 区分: 颜色, 样式, 宽度的:
颜色: 要么用#开头, 要么是那几个固定的颜色单词,
样式: 也是固定的表示样式的单词, 如solid dotted dash inset outset ridge...
宽度: 要么是数字1, 2px,,, 要么是表示宽度的那几个单词.
所以, 不管你按什么顺序写, css解析器都是能够正确识别的, 只要你单词写正确, 格式写正确, 正确的用空格分隔就好了
比如: 下面的border顺序就完全是 随意的, 同样能够正确识别/生效:
更正一下, 以前说 inset, outset等边框, 只有右下角的边框才会显式 设置的颜色, 而坐上角的边框总是黑色, 这个是 错误的, 正确的说法是: 所有的边框, 都会正确的显式设置的颜色, 即使在 (inset(这个样式是最常用的...), outset)等特殊样式下. 只是你没有看 清楚 而已...
border的emmet写法, 由于bd后面 的内容, 可能是用单词 来 表达颜色, 宽度, 样式的, 所以, 如果用bd同时加上这些单词的缩写的话, emmet是认不到属性名是border的. 所以 两种方法解决问题: 要么你先 只写bd, 展开后, 然后 再写具体的值; 要么, 你用数字表示宽度的 紧跟在bd后面 (bd后只能是 数字, ba后只能是数字, 跟单词/字母都不行, 都不能被识别). 同时加上 连字符, [比较特殊的是 如果数字后面是用# 表示 的颜色分隔符, 可以不用连字符分割]
凡是一个style属性 有多个属性值的情况, 不只是 margin的四个属性值m10-20-30-40需要用连字符, 凡是一个属性名称后, 有多个属性值需要规定的, 都应该用连字符, 如border , background...
================================================ ==
几个参考文章:
http://www.cnblogs.com/java-my-life/archive/2012/08/06/2625065.html
http://www.w3school.com.cn/js/js_datatypes.asp
http://www.w3school.com.cn/js/js_datatypes.asp
http://www.cnblogs.com/web-sheena/archive/2012/06/25/2560868.html
border边框的宽度/样式/颜色 全部值的更多相关文章
-
边框(border)宽度样式颜色 和基本属性
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
-
border——边框属性
一.第一层次(复合样式) <style> p.one{border:1px solid black;} /*边框:1像素 实心的 黑色:*/ </style> <body ...
-
css border-bottom(指定下边线的样式、宽度及颜色)
border-bottom(指定下边线的样式.宽度及颜色) border-bottom: 值: border-bottom-style:值; border-bottom-color: 值; borde ...
-
border边框属性
边框属性: 边框宽度(border-width):thin.medium.thick.长度值 边框颜色(border-color):颜色.transparent(透明) 边框样式(border-sty ...
-
CSS border边框属性教程(color style)
CSS 边框即CSS border-border边框样式颜色.边框样式.边框宽度的语法结构与应用案例教程篇 一.CSS 边框基础知识 CSS 边框即CSS border是控制对象的边框边线宽度.颜色. ...
-
CSS边框及常用样式
一.CSS设置样式 1.1 边框border 作用:设置标签周围的边框,方法 board:宽度 样式 颜色,一般情况下样式使用 solid实体的,和dotted虚线的 <head> &l ...
-
CSS样式设置语法全解,样式优先级、值和单位、字体、文本、块级元素,行内元素,替换元素、非替换元素、display、float、position、table、li、光标、边距边框、轮廓、颜色背景
全栈工程师开发手册 (作者:栾鹏) 一个demo学会css css选择器全解 css操作语法全解 CSS样式设置语法全解: 样式优先级 1. !important标记的样式 > 内联样式(sty ...
-
DIV+CSS颜色边框背景等样式
1.使用css缩写 使用缩写可以帮助减少你CSS文件的大小,更加容易阅读.css缩写的主要规则请参看<常用css缩写语法总结>,css缩写的主要规则如下: 颜色 16进制的色彩值,如果每两 ...
-
padding(内边框), border(边框), margin, 标准文档流, 块级元素和行内元素, 浮动 ,margin的用法
盒模型 在CSS中,"box model"这一术语是用来设计和布局时使用,然后在网页中基本上都会显示一些方方正正的盒子.我们称为这种盒子叫盒模型. 盒模型有两种:标准模型和IE模型 ...
随机推荐
-
自定义Spring Security权限控制管理(实战篇)
上篇<话说Spring Security权限管理(源码)>介绍了Spring Security权限控制管理的源码及实现,然而某些情况下,它默认的实现并不能满足我们项目的实际需求,有时候需要 ...
-
pyOpenSSL0.13安装失败
/usr/lib64/python2.4/distutils/dist.py:236: UserWarning: Unknown distribution option: 'zip_safe' war ...
-
联想VIBE UI 固件ROM刷机包集合
固件下载_联想乐问吧http://ask.lenovomobile.com/?c-157.html 联想VIBE UI 固件ROM刷机包集合 悬赏分:0 解决时间:2014/09/12 15: ...
-
Apache 的启动/重启/停止
Task: Start Apache 2 Server /启动apache服务 # /etc/init.d/apache2 startor$ sudo /etc/init.d/apache2 star ...
-
JSON数组操作
在jquery中处理JSON数组的情况中遍历用到的比较多,但是用添加移除这些好像不是太多. 今天试过json[i].remove(),json.remove(i)之后都不行,看网页的DOM对象中好像J ...
-
NYIST OJ 题目38 布线问题
最小生成树水题,先按最小生成树做,答案最后加上最小的从第i号楼接线到外界供电设施所需要的费用即可. #include<cstdio> #include<cstring> #in ...
-
realypay
1.判断新老接口的方法: 去网站后台接口配置的地方,如果有merchantno参数就是新接口,否则为老接口,新接口则不需要更新了. 2.老接口需要去网站后台卸载老的接口,然后再用新的(下载的文件)覆盖 ...
-
HDU 2296 Ring [AC自动机 DP 打印方案]
Ring Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Submissio ...
-
习题9-4 uva 1630
题意: 给你一串数字,要求你对其进行折叠使其长度最短. 折叠情况:全是一个字母 & 重复的字符串 AAAAAAAAAABABABCCD --> 9(A)3(AB)CCD NEE ...
-
Java框架中Struts和Struts2框架的区别
struts1 与 struts2 的区别:1.都是 MVC 的 WEB 框架,2 struts1的老牌框架,应用很广泛,有很好的群众基础,使用它开发风险很小,成本更低!struts2虽然基于这个框架 ...