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. ubuntu 如何在recovery模式修改root密码

    今天遇到一个问题, 前提1: ubuntu系统的root密码我一直没有设定  前提2: ubuntu初始创建的sudo用户不知道怎么移除sudo权限用户了. 下面就精彩了, 首先没有root密码,你不 ...

  2. webservice 缓存机制

    本文转载:http://blog.csdn.net/zhdd1234/article/details/4555472 WebService的缓存分为两种,一种是简单的输出缓存,一种是强大的数据缓存 一 ...

  3. getDefinitionByName与ApplicationDomain.getDefinition

    主swf 定义:MC,被加载swf 定义:MC.MC1 ①父SWF的应用程序域的新建子域 (默认方式)称其为应用程序域的继承 var app:ApplicationDomain=new Applica ...

  4. Maven3.2创建webapp项目过程中问题以及解决方案

    用maven组件来创建web项目,maven的好处一大堆,但是在创建项目的时候问题也很多,诸多不顺,网上找了很多资料,貌似都没能解决问题. 环境:jdk1.7.0_80,eclipse4.4,mave ...

  5. w3cmark前端精彩博文周报 10.13-10.19

    w3cmark推出每周精选前端博文推荐,通过阅读别人的代码,学习别人的经验,提升自己的水平.欢迎关注 @前端笔记网 微博.其实如果是关注我们微博的朋友都对下面的文章熟悉,因为我们会一旦发现有价值的.精 ...

  6. TransactionScope使用

    public void FixProjectSorceInsert() { TransactionOptions transactionOption = new TransactionOptions( ...

  7. oc-12-NSString 类简单介绍及用法

    // 11-[掌握]NSString 类简单介绍及用法 #import <Foundation/Foundation.h> int main(int argc, const char * ...

  8. Solaris 安装JDK

    http://blog.csdn.net/cymm_liu/article/details/46966237  整理自前辈的博客:http://segmentfault.com/a/119000000 ...

  9. mysqlpump 原理

    Oracle官方多线程逻辑备份工具 昨天Inside君写到MySQL 5.7.11版本发布,其中最有意义的部分在于官方修复了之前mysqlpump工具一致性备份的问题,使得mysqlpump工具在生产 ...

  10. phonegap platform add ios 出错的问题

    在Mac上新安装的Phonegap,版本3.3-0.18.0. 本来创建项目后按教程: http://docs.phonegap.com/en/edge/guide_platforms_ios_ind ...