border-style 属性用于设置元素所有边框的样式,或者单独地为各边设置边框样式。

border-style:dotted solid double dashed; 

border-style的属性方位有四个分别为上、右、下、左,那么相对应border-style的dotted solid double dashed分别表示为上边框是点状、右边框点线、下边框双线和左边框虚线,当我们只定义一个属性的时候则边框为这一种属性。若边框的样式为none或hidden,否则边框不会出现。

border-color边框颜色定义方法为“#123456”、 “rgb(123,123,123)”、“red”等。

border-width边框宽度,其属性有thin(薄)、medium(普通)和thick(厚)。如图:

下面例举一些常见的边框示例:

<head>
<style type="text/css">
p.dotted {border-style: dotted}
p.dashed {border-style: dashed}
p.solid {border-style: solid}
p.double {border-style: double}
p.groove {border-style: groove}
p.ridge {border-style: ridge}
p.inset {border-style: inset}
p.outset {border-style: outset}
</style>
</head>

<body>
<p class="dotted">border</p>

<p class="dashed">border</p>

<p class="solid"border</p>

<p class="double">border</p>

<p class="groove">border</p>

<p class="ridge">border</p>

<p class="inset">border</p>

<p class="outset">border</p>
</body>

CSS之边框属性的更多相关文章

  1. CSS border边框属性教程(color style)

    CSS 边框即CSS border-border边框样式颜色.边框样式.边框宽度的语法结构与应用案例教程篇 一.CSS 边框基础知识 CSS 边框即CSS border是控制对象的边框边线宽度.颜色. ...

  2. CSS的背景属性和边框属性

    CSS的背景属性: background 简写属性,作用是将背景属性设置在一个声明中 background-attachment 背景图像是否固定或者随着页面的其余部分滚动 background-co ...

  3. css3设置边框属性

    css设置边框属性:设置边框圆角 <!DOCTYPE html> <html> <head lang="en"> <meta charse ...

  4. CSS常用样式属性

    1.CSS字体和文本相关属性 属性 font-family 规定文本的字体系列,比如:“serif” ''sans-serif" font-size 规定文本的字体尺寸 font-style ...

  5. div介绍 盒子模型边框属性 CSS初始化 文字排版 边框调整 溢出

    今天学习的div,了解了div是干什么用的掌握了什么是盒子模型,以及div的外边距内边距以及边框,运用div和CSS给文字排版,利用边框的来做图像,div溢出的处理 CSS初始化: 精确排版的时候用这 ...

  6. Web前端篇:CSS常用格式化排版、盒模型、浮动、定位、背景边框属性

    目录 Web前端篇:CSS常用格式化排版.盒模型.浮动.定位.背景边框属性 1.常用格式化排版 2.CSS盒模型 3.浮动 4.定位 5.背景属性和边框属性 6.网页中规范和错误问题 7.显示方式 W ...

  7. CSS .css边框属性(border)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. HTML&CSS基础-边框简写属性

    HTML&CSS基础-边框简写属性 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.HTML源代码 <!DOCTYPE html> <html> ...

  9. CSS中box-sizing属性的理解与部分用法

    今天看了一些关于box-sizing的一些资料,在这里整理一下,希望也能对大家有所帮助. box-sizing是CSS的一个属性,很好的解决了盒模型的相关问题.CSS中的盒模型(Box model)分 ...

随机推荐

  1. C# Dictionary用法总结

    转自:http://www.cnblogs.com/linlf03/archive/2011/12/09/2282574.html http://www.cnblogs.com/linzheng/ar ...

  2. U3D中的协同等待函数

    WaitForSeconds.WaitForseconds等待函数; 创建一个yield指令,来等待给定的秒数; using UnityEngine; using System.Collections ...

  3. C# 钩子HOOK专题(1)

    目录   基本概念 运行机制 钩子类型 作者 基本概念   钩子(Hook),是Windows消息处理机制的一个平台,应用程序可以在上面设置子程以监视指定窗口的某种消息,而且所监视的窗口可以是其他进程 ...

  4. 【转】Ruby入门教程(一)

    1. Ruby环境搭建 在Windows下,搭建Ruby环境,比较简单的方法是在“RubyInstaller”上下载一个合适的版本(D瓜哥使用的是最新版),直接安装就可以了. 另外,吐槽两句,网上有人 ...

  5. iOS开发笔记系列-基础7(C语言特性)

    Objective-C是C语言的扩展,因此,也具备很多C语言的基本特性,这里只罗列部分. 块(Blocks) 块是对C语言的一种扩展,它并未作为标准ANSI C所定义的部分,而是Apple添加到语言中 ...

  6. Codeforces Round #172 (Div. 2) B. Nearest Fraction 二分

    B. Nearest Fraction Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/281/p ...

  7. Cucumber 入门一

    (转自:http://www.cnblogs.com/jarodzz/archive/2012/07/02/2573014.html) 第一次看到Cucumber和BDD(Behavior Drive ...

  8. [Javascript] Other functor

    EventStream: You can use RxJS, BaconJS or any reactive programming lib you want: var id_s = map(func ...

  9. android146 360 病毒查杀

    <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=&quo ...

  10. ptrace x64 转

    #include <sys/ptrace.h> #include <sys/types.h> #include <sys/wait.h> #include < ...