当前位置:首页 > 技术知识 > 正文内容

css设置div只显示某一边的边框_div只显示一行

maynowei7个月前 (09-11)技术知识76

在网页设计中经常用到css来设计各种边框样式以及颜色等,有时候需要一个div只显示一个边框,那么你可能会用到下面的一些方法。

一、CSS border-width 属性

border-width是实现显示边框的重要属性。用法如下:

border-width:top right bottom left

参数说明:

top:上边框属性,可以设置像素,也可以设置样式,意思为上边框的宽度。

right:右边框属性,可以设置像素,也可以设置样式,意思为上边框的宽度。

bottom:下边框属性,可以设置像素,也可以设置样式,意思为上边框的宽度。

left:左边框属性,可以设置像素,也可以设置样式,意思为上边框的宽度。

其中像素如:10px 20px等

内置样式有:

thin:定义细的边框;

medium:默认值,定义中等边框;

thick:定义粗的边框;

inherit:继承父元素的边框宽度。

二、CSS border-style 属性

border-style是用来设置边框线样式的,语法如下:

border-style:样式;

其中可设置的样式有:

none 定义无边框。

hidden 与 "none" 相同。不过应用于表时除外,对于表,hidden 用于解决边框冲突。

dotted 定义点状边框。在大多数浏览器中呈现为实线。

dashed 定义虚线。在大多数浏览器中呈现为实线。

solid 定义实线。

double 定义双线。双线的宽度等于 border-width 的值。

groove 定义 3D 凹槽边框。其效果取决于 border-color 的值。

ridge 定义 3D 垄状边框。其效果取决于 border-color 的值。

inset 定义 3D inset 边框。其效果取决于 border-color 的值。

outset 定义 3D outset 边框。其效果取决于 border-color 的值。

inherit 规定应该从父元素继承边框样式。

三、实例应用

只要定义边框不为0,即可显示边框(但是需要定义边框线样式),如果想要只显示下边框就相当于把top、right、left设置为0px;下边框不为0即可。

实例如下:

<html>

<head>

<meta charset='utf-8'>

<title>标题</title>

</head>

<body>

<style>

.show{ border-width: 0 0 1px 0; border-style: solid; border-color: black; }

</style>

<div class='show'>只显示下边框</div>

</body>

</html>

显示如下:

如果想要只显示右边框只需要改border-width属性为 0 1px 0 0即可。

相关文章

btrace 3.0 重磅新增 iOS 支持!免插桩原理大揭秘!

重磅更新btrace 是由字节跳动抖音基础技术团队自主研发的面向移动端的性能数据采集工具,它能够高效的助力移动端应用采集性能 Trace 数据,深入剖析代码的运行状况,进而辅助优化提升移动端应用的性能...

关于异步信号安全(下面关于异步电路危害的描述错误的是)

线程安全与重入以及异步信号安全的区别. 可重入一定是线程安全的,但是线程安全不一定是可重入的. 引用别人的博客中的话吧.如下: http://blog.csdn.net/xiaofei0859/art...

Oracle中泄露“天机”的TNS(在oracle中发出的下列查询)

数据库的安全是长期存在的问题。在目前大量的数据泄露事件以及漏洞面前,大家看到的大都是SQl注入、越权操作、缓冲区溢出等这些具体漏洞。往往却忽视了造成这些问题的前提,黑客想要入侵数据库一定会尝试获取数据...

oracle和mysql的优缺点对比(oracle和mysql哪个简单)

oracle的优缺点优点:开放性:oracle 能所有主流平台上运行(包括 windows)完全支持所有工业标准采用完全开放策略使客户选择适合解决方案对开发商全力支持;可伸缩性,并行性:Oracle...

Oracle工具PLSQL登录时提示初始化失败,无法锁定OCI.dll错误解决

报错信息: (没有登录)-PL/SQL Developer Initialization error 无法锁定OCI dll OracleHomeKey: OracleHomeDir:E\instan...

Think in Mingdao——人人都是全栈工程师

文/明道云销售部顾问 文静编辑/蒋礼轩一、引言在软件开发领域,有这样一类"Think"系的书籍被广大程序员们奉为经典,如:Think in C++、Think in C#、Think...