CSS border-right-style属性设置元素的右边框样式

边框的样式指的是边框的线条属性,指的是边框采用的是实线效果、短线效果还是其它的线条效果。

border-right-style属性设置的是某一元素的右边框的样式。

语法格式如下:

border-right-style : none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset

border-right-style属性适用于所有元素。

border-right-style属性值说明如下:

属性值 说明
none 无右边框。
dotted 右边框由点组成,形成点线效果。
dashed 右边框由短线组成,形成短线效果。
solid 右边框是实线。
double 右边框是双实线,形成双实线效果。
groove 右边框带有立体效果的沟槽。
ridge 右边框成脊形。
inset 右边框内嵌一个立体边框。
outset 右边框外嵌一个立体边框。

只有右边框和元素以及页面其它属性结合在一起的时候,才能真正展现其样式。上表中,groove、ridge、inset以及outset等和右边框颜色结合设置才能达到更好的效果。

border-right-style属性实例

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>CSS border-right-style属性设置元素的右边框样式实例-www.manongjc.com</title>
<style type="text/css">
<!--
p{width:350px;}
.dotted{border-right-style:dotted;}
.dashed{border-right-style:dashed;}
.solid{border-right-style:solid;}
.double{border-right-style:double;}
.groove{border-right-style:groove;}
.ridge{border-right-style:ridge;}
.inset{border-right-style:inset;}
.outset{border-right-style:outset;}
-->
</style>
</head>
<body>
<p class="dotted">右边框由点组成,形成点线效果。</p>
<p class="dashed">右边框由短线组成,形成短线效果。</p>
<p class="solid">右边框是实线。</p>
<p class="double">右边框是双实线,形成双实线效果。</p>
<p class="groove">右边框带有立体效果的沟槽。</p>
<p class="ridge">右边框成脊形。</p>
<p class="inset">右边框内嵌一个立体边框。</p>
<p class="outset">右边框外嵌一个立体边框。</p>
</body>
</html>

  

参考阅读:http://www.manongjc.com/article/1189.html

CSS border-right-style属性设置元素的右边框样式的更多相关文章

  1. zIndex 属性设置元素的堆叠顺序。

    http://www.w3school.com.cn/jsref/prop_style_zindex.asp zIndex 属性设置元素的堆叠顺序. 该属性设置一个定位元素沿 z 轴的位置,z 轴定义 ...

  2. [iOS微博项目 - 4.3] - 设置每条微博边框样式

    github: https://github.com/hellovoidworld/HVWWeibo A.设置每条微博边框样式 1.需求 不需要分割线 每个微博之间留有一定的间隙   2.思路 直接设 ...

  3. 使用 CSS3 的 box-sizing 属性设置元素大小包含 border 与 padding

    Ø  默认情况下,内部元素(如:input)的宽度或高度,是不会包含元素的边框和内边距的,这时就需要使用 box-sizing 属性设置该元素. Ø  box-sizing 是 CSS3 的属性,可以 ...

  4. CSS背景图片常见属性设置

    在CSS中,图片属性的设置是必不可少的,下面介绍一下常见的图片属性: 1)背景图片插入:background-image:url(位置及名称);  //默认在父级元素内的左上角 2)背景平铺方式:ba ...

  5. [转]CSS如何设置html table表格边框样式

    原文地址:http://www.divcss5.com/wenji/w503.shtml 对table设置css样式边框,分为几种情况: 1.只对table设置边框 2.对td设置边框 3.对tabl ...

  6. javascript中DOM获取和设置元素的内容、样式及效果

    getElementById() 根据id获取dom元素 没有找到则返会Null <!DOCTYPE html> <html lang="en"> < ...

  7. draggable属性设置元素是否可拖动。

    设置标签属性draggable="true"将一个标签内的元素拖动到另外一个标签进行显示: <!DOCTYPE HTML> <html> <head& ...

  8. vertical-align 属性设置元素的垂直对齐方式。

     值 描述 baseline 默认.元素放置在父元素的基线上. sub 垂直对齐文本的下标. super 垂直对齐文本的上标 top 把元素的顶端与行中最高元素的顶端对齐 text-top 把元素的顶 ...

  9. android dialog style属性设置

    <!--最近做项目,用到alertDialog,用系统自带的style很难看,所以查了资料自己定义了个style. res/value/style.xml内增加以下代码:--> <s ...

随机推荐

  1. dubbo支持的注册中心

    dubbo支持的注册中心 Dubbo提供的注册中心有如下几种类型可供选择: Multicast注册中心 Zookeeper注册中心 Redis注册中心 Simple注册中心 ZooKeeper是一个开 ...

  2. Samsung_tiny4412(驱动笔记09)----alloc_pages,kmalloc,vmalloc,kmem_cache,class

    /*********************************************************************************** * * alloc_pages ...

  3. git log 退出方法

    前言 使用git的过程中会有一些疑问,理当记录,方便自己随时查看,可能也会帮助他人解惑,甚好! 1.git log退出方法 使用git log之后无法回到主页面,如下图所示,最后只能暴力关闭git b ...

  4. BZOJ5091: [Lydsy1711月赛]摘苹果【期望DP】

    Description 小Q的工作是采摘花园里的苹果.在花园中有n棵苹果树以及m条双向道路,苹果树编号依次为1到n,每条道路的两 端连接着两棵不同的苹果树.假设第i棵苹果树连接着d_i条道路.小Q将会 ...

  5. 20155229 2016-2017-2 《Java程序设计》第五周学习总结

    20155229 2016-2017-2 <Java程序设计>第五周学习总结 教材学习内容总结 第八章: Java中所有错误都会被打包为对象. 设计错误对象都继承自java.lang.Th ...

  6. JQuery 遮罩层弹窗

    var str = "<div id=\"zhezhao\" style=\"display:none; background-color: rgba(0 ...

  7. 出于迁移项目的考虑,GitHub 中 Fork 出来的项目,如何与原项目断开 Fork 关系?

    如果需要为 GitHub 上的项目做贡献,我们通常会 Fork 到自己的名称空间下.在推送代码之后添加 pull request 时,GitHub 会自动为我们跨仓库建立 pull request 的 ...

  8. LG4197 Peaks

    题意 题目描述 在Bytemountains有N座山峰,每座山峰有他的高度hih_ihi​.有些山峰之间有双向道路相连,共MMM条路径,每条路径有一个困难值,这个值越大表示越难走,现在有QQQ组询问, ...

  9. 进程间通信--POSIX消息队列

    相关函数: mqd_t mq_open(const char *name, int oflag); mqd_t mq_send(mqd_t mqdes, const char *msg_ptr, si ...

  10. c 结构体的队列

    头文件 lsg_queue.h #pragma once #include<stdbool.h> /* 链式栈接口的定义头文件 */ #define true 1 #define fals ...