四个边框

border-left 设置左边框,一般单独设置左边框样式使用
border-right 设置右边框,一般单独设置右边框样式使用
border-top 设置上边框,一般单独设置上边框样式使用
border-bottom 设置下边框,一般单独设置下边框样式使用,有时可将下边框样式作为css下划线效果应用。

四边相同边框border简写
#divcss5{border:1px solid #00F}
设置了divcss5对象盒子1px像素蓝色实线边框

边框三个样式
通常我们可以对边框设置宽度(厚度)、边框样式、边框颜色这三个属性与参数。

边框样式值如下:

none :  无边框。与任何指定的border-width值无关
hidden :  隐藏边框。IE不支持
dotted :  在MAC平台上IE4+与WINDOWS和UNIX平台上IE5.5+为点线。否则为实线(常用)
dashed :  在MAC平台上IE4+与WINDOWS和UNIX平台上IE5.5+为虚线。否则为实线(常用)
solid :  实线边框(常用)
double :  双线边框。两条单线与其间隔的和等于指定的border-width值
groove :  根据border-color的值画3D凹槽
ridge :  根据border-color的值画菱形边框
inset :  根据border-color的值画3D凹边
outset :  根据border-color的值画3D凸边

边框样式截图:

5

我们通常使用主流浏览器兼容边框样式有:

1、实线边框:solid
Border:1px solid #000 设置对象1px(像素)宽厚的黑色实线边框。

2、虚线边框:dashed
Border:1px dashed #000 设置对象1px(像素)宽厚的黑色虚线边框。

Css border样式的更多相关文章

  1. 精简的网站reset 和 css通用样式库

    参考链接:http://www.zhangxinxu.com/wordpress/2010/07/我是如何对网站css进行架构的/ reset.css body{ line-height:1.4; c ...

  2. css初始化样式代码

    为什么要初始化CSS? CSS初始化是指重设浏览器的样式.不同的浏览器默认的样式可能不尽相同,所以开发时的第一件事可能就是如何把它们统一.如果没对CSS初始化往往会出现浏览器之间的页面差异.每次新开发 ...

  3. WEB前端开发CSS基础样式全面总结

    Web前端开发css基础样式全面总结 颜色和单位的使用 颜色 用颜色的名字表示颜色,比如:red 用16进制表示演示 比如:#FF0000 用rgb数值表示颜色,rgb(红,绿,蓝),每个值都在0-2 ...

  4. CSS常用样式及示例

    CSS常用样式及示例 一.简介      层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集) ...

  5. CSS Reset样式重置

    为了让页面在各不同浏览器之间显示效果一致,CSS样式清除和重置是前端开发必需要做的事情,结合前车之鉴,整理了份CSS重置样式代码供参考. @charset "utf-8"; /* ...

  6. CSS详细样式

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xht ...

  7. CSS border三角、圆角图形生成技术简介

    http://www.zhangxinxu.com/wordpress/?p=794 一.前言 利用CSS的border属性可以生成一些图形,例如三角或是圆角.纯粹的CSS2的内容,没有兼容性的问题, ...

  8. 第1天:CSS基本样式

    今天学习了CSS基本样式和属性.在做练习的时候遇到一个小问题,最后解决了. 记住:浏览器有默认margin和padding.样式最开始记得一定写:*{margin:0;padding:0}. 学习经验 ...

  9. 用JS控制CSS基本样式

    详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcytp29 用JS控制CSS基本样式的方法 CSS code .class1 { ...

随机推荐

  1. [JZOJ 5894] [NOIP2018模拟10.5] 同余方程 解题报告(容斥)

    题目链接: http://172.16.0.132/senior/#contest/show/2523/0 题目: 题解:(部分内容来自https://blog.csdn.net/gmh77/arti ...

  2. [NOIP2017] 逛公园 解题报告(DP)

    我很不想说 在我的AC代码上我打了表,但实在没有办法了.莫名的8,9个点RE.然而即便是打表...也花了我很久. 这大概是NOIP2017最难的题了,为了让不懂的人更容易理解,这篇题解会比较详细 我的 ...

  3. java基础——单例设计模式(懒汉式)

    public class Test7 { // 主函数 public static void main(String[] args) { Test7.getInstance().function(9, ...

  4. Visual Studio蛋疼问题解决(1)

    监视变量显示未定义标识符: VS2012在编译的时候采用了较快的编译模式,所以有些变量就显示未定义了.  解决方案:  项目->属性->c/c++->优化->改为禁用/OD  ...

  5. XML学习(一)——xml内容简介

    一.什么是XML xml全称为Extensible Markup Language,意思是可扩展的标记语言.XML语法上和HTML比较相似,但是HTML中的元素是固定的,而XML的标签是可以用户定义的 ...

  6. jquery根据接口返回的值来设置asp:CheckBoxList的选中值

    接口返回一个json的值,然后通过jquery来选中asp:CheckBoxList相应选中的值 <asp:CheckBoxList runat="server" Repea ...

  7. Visual Studio中C++工程的环境配置方法

    在Visual Studio的C++工程设置 1.添加工程的头文件目录:工程---属性---配置属性---c/c++---常规---附加包含目录. 2.添加文件引用的lib静态库路径:工程---属性- ...

  8. NOIp2018模拟赛四十二

    今天看标题终于回到了“NOIP模拟赛”,十分高兴啊! 然后一打开题目: ********** 所以今天又是一场NOIPlus模拟赛(微笑) 成绩:0+70+0=70 A题想了个贪心被myh两分钟cha ...

  9. js Date() 时间函数处理 关于 toLocaleDateString()

    toLocaleDateString()方法的真正含义为「根据本地时间把Date对象的日期部分转换为字符串」,这意味着:在不同的浏览器或者服务器中,我们可能得到不同的字符串. 例如,将 Chrome ...

  10. java 对象 拆箱装箱 编译和反编译的验证

    创建对象 package 创建对象的个数; public class main { public static void main(String[] agrs){ Check c1=new Check ...