border属性 border-width  border-style  border-color  inherit

border-style的值:none  dotted(点线)  dashed(虚线)  solid(实线) double(双线)  groove(凹槽)  ridge(凸起)  inset outset   inherit

div {
border: 1px solid #ff0000;
}
div {
border-bottom: 1px solid #ff0000;
}

CSS3新增的有border-radius  box-shadow  border-image

border-radius可以用em、px、%来指定圆角大小  也可以四个角单独指定

div {
border-radius: 50%;
}
div {
border-top-left-radius:2em;
border-top-right-radius:2em;
border-bottom-right-radius:2em;
border-bottom-left-radius:2em;
}

box-shadow  水平阴影  垂直阴影  阴影长度  阴影颜色

div {
box-shadow: 10px 10px 5px #ff0000;
}

border-image 请参阅 http://www.w3school.com.cn/tiy/t.asp?f=css3_border-image

border使用的更多相关文章

  1. 理解CSS边框border

    前面的话   边框是CSS盒模型属性中默默无闻的一个普通属性,CSS3的到来,但得边框属性重新焕发了光彩.本文将详细介绍CSS边框 基础样式   边框是一条以空格分隔的集合样式,包括边框粗细(边框宽度 ...

  2. css样式之border

    border用法详解: 1.border-width 属性设置边框的宽度 可能的值:像素 2.border-style 属性设置边框的样式 可能的值:solid(直线),dashed(虚线),dott ...

  3. 通过CSS的border绘制三角形

    通过css的border 可以绘制出三角形, 不同的样式组合,有着不同的效果,可以控制它的大小,颜色,方向.看下面各种图形,相信可能还有很多图形,大家都没见过. 先写出公共的样式: .border { ...

  4. css3学习--border

    http://blog.sina.com.cn/s/blog_61671b520101gelr.html border-radius border-radius: 50px 20px;上下都是50px ...

  5. border:none 和border:0区别差异

    border:none与border:0的区别体现为两点:一是理论上的性能差异,二是浏览器兼容性的差异. 性能差异: [border:0;]把border设为“0”像素效果等于border-width ...

  6. WPF 通过Border来画边框

    WPF有自己的表格控件DataGrid.ListBox等,如果只是简单的需求,可以通过Border控件来画边框. 比如我们需要给上面的控件加上边框. <Window x:Class=" ...

  7. css border属性做小三角标

    <!doctype html><html> <head> <title></title> <meta charset="ut ...

  8. 使用border做三角形

    网站上经常会使用一些三角形,除了图片的方式,实际上利用border我们可以做出纯CSS的三角形.我们知道border是个边抖可以单独设置,当四个边相交的时候他们是什么时候改变的? .t0{ margi ...

  9. iPhone 6/plus iOS Safari fieldset border 边框消失

    问题:iPhone6 plus 手机浏览网页,fieldset border 边框消失. 示例代码: <div> <fieldset style="border: 1px ...

  10. 原来css中的border还可以这样玩

    原来css中的border还可以这样玩 前面的话: 在看这篇文章之前你可能会觉得border只是简单的绘制边框,看了这篇文章,我相信你也会跟我一样说一句"我靠,原来css中的border还可 ...

随机推荐

  1. do{}while(0)

    有时会在源码中或在写代码时在宏定义中用到do...while(0). 采用这种方式进行宏定义, 主要是为了防止出现以下错误 : do{}while(0) 空的宏定义避免出现warnning. #def ...

  2. Chrome Headless模式

    在 Chrome 59 版本开始已经开始支持了 Headless 模式,也就是无界面模式,这样爬取的时候就不会弹出浏览器了,如果要使用此模式请把 Chrome 升级到 59 版本及以上,启用 Head ...

  3. openoffice启动服务并将office文件转换为pdf文件

    1.首先下载最新版的openoffice工具,安装完成之后安装服务,, win+r打开命令提示符 输入cmd,cd C:\Program Files (x86)\OpenOffice 4\progra ...

  4. js中阻止事件冒泡和浏览器默认行为

    在使用javascript编程时会遇到一个问题,就是当你给html添加事件时,由于浏览器默认的为冒泡型事件触发机制,所以会触发你不想触发的事件.那么通过如下的函数可以解决这个问题.[兼容IE和FF] ...

  5. debian 7 安装

    1. 从 live cd 或者 dvd 进行安装,官方文档已经够用,可以将 live cd 写进 u 盘,也可以将 dvd 放到硬盘上通过 grub 引导启动安装,文档在这里. 2.安装过程中尽量选择 ...

  6. PatentTips - Substitute virtualized-memory page tables

    BACKGROUND Many computer systems utilize virtualized memory for security, stability and/or other pur ...

  7. GDB 调试 PHP文件

    http://www.bo56.com/%E5%9C%A82016%E7%9A%84phpcon%E5%A4%A7%E4%BC%9A%E4%B8%8A%E7%9A%84%E5%88%86%E4%BA% ...

  8. [转]十五天精通WCF——第三天 client如何知道server提供的功能清单

     通常我们去大保健的时候,都会找姑娘问一下这里能提供什么服务,什么价格,这时候可能姑娘会跟你口述一些服务或者提供一份服务清单,这样的话大 家就可以做到童嫂无欺,这样一份活生生的例子,在wcf中同样是一 ...

  9. 如何杀掉(kill)Oracle中的会话(Session)

    Oracle中造成一些表被死锁或者会话异常退出,如执行了更新记录操作后,既没有commit也没有rollback,网络就断开了,也会造表或记录被锁住,待到超时后才会被解开,那样都会造成应用操作被阻塞. ...

  10. vim中凝视多行python代码

    在vim中凝视多行python代码比較麻烦,主要由下面几种方法: (1)将须要凝视的代码以文档字符串的形式呈现 (2)将须要凝视的代码以函数的形式呈现 (3)使用vim自身快捷键 我们主要使用第三种方 ...