html div + css 下划线
这里通过边框属性的虚线边框border控制虚线。以下设置的css 高度(css height)和css 宽度(css width)为350像素是为了便于观看演示 其它意思。
一、四边为虚线边框
border:1px dashed #000; 黑色虚线边框
实例:
CSS代码: .divcss5{border:1px dashed #000; height:50px;width:350px}
Html代码: <div class="divcss5">我的四边为黑色虚线边框</div>
这里设置边框缩写方式定义divcss5选择器四边边框为1px的黑色虚线边框
二、左边为虚线:
CSS代码: .divcss5-1{border-left:1px dashed #000; height:50px;width:350px}
Html代码: <div class="divcss5-1">我的左边为黑色虚线边框</div>
这里设置了左边一边为黑色虚线边框
三、右边为虚线:
CSS代码: .divcss5-2{border-right:1px dashed #000; height:50px;width:350px}
Html代码: <div class="divcss5-2">我的右边为黑色虚线边框</div>
这里设置了右边一边为黑色虚线边框
四、顶部边(上边)为虚线:
CSS代码: .divcss5-3{border-top:1px dashed #000; height:50px;width:350px}
Html代码: <div class="divcss5-3">我的上边为黑色虚线边框</div>
这里设置了顶边(上边线)一边为黑色虚线边框
五、底部边(下边)为虚线:
CSS代码: .divcss5-4{border-bottom:1px dashed #000; height:50px;width:350px}
Html代码: <div class="divcss5-4">我的下边为黑色虚线边框</div>
这里设置了底边(下边线)一边为黑色虚线边框
六、任意一边不为虚线,其它三边为虚线情况
加入右边边框不为虚线而没有边线,其它三边为黑色虚线边框
CSS代码: .divcss5-5{border:1px dashed #000;border-right:0; height:50px;width:350px}
Html代码: <div class="divcss5-5">我的右边边框无边线而其它三边为黑色虚线边框实例</div>
这里通过先设置了该对象四边为黑色1px虚线边框,紧接着又设置一边边线为0的设置,这样相当于设置了3边的边框虚线属性,但是这里注意边框属性设置前后顺序。
详情链接:http://www.divcss5.com/shili/s296.shtml
html div + css 下划线的更多相关文章
- 用CSS下划线距离
但在我在CSS中新加了TEXT-DECORATION: underline; 后发现下划线离文本太近了,很难看. 代码一: a { text-decoration: none; background: ...
- “div+css”下拉菜单
<style> html, body { margin: 0; padding: 0; } .btn-group{ font-size: 14px; position: relative; ...
- CSS 定义上划线、下划线、删除线代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 使用CSS去除 去掉超链接的下划线方法
我们可以用CSS语法来控制超链接的形式.颜色变化,为什么链接一定要使用下划线和颜色区分呢? 其主要原因主要是考虑到 1.视力差的人 2.色盲的人 ... 下面我们做一个这样的链接:未被点击时超链接 ...
- 实现文字下划线 ---模拟text-decoration
css 的text-decoration可以实现文字下方的下划线,但是距离文字比较近,不是很好看,我们可以使用border-bottom来模拟这个效果 (inline元素虽然不可以设置margin-t ...
- jq实现跟随鼠标点击移动的下划线效果
效果如下: 1.html代码: <div class="center-left-tap"> <a href="javascript:void (0)&q ...
- [转]CSS 类名的单词连字符:下划线还是横杠?
问题 CSS 类或 ID 命名时单词间连接通常有这几种写法: 驼峰式: solutionTitle.solutionDetail 用横杠连接: solution-title.solution-deta ...
- [CSS]textarea设置下划线格式
功能要求:1:如何实现在多行文本框textarea里面每一行下面都有一条横线 2:textarea文本框里面有一段不能删掉 实现方法:横线用背景图片来做,不动的文字用浮动层+给textarea增加t ...
- CSS 类名的单词连字符:下划线还是连接符?
本文的部分内容整理自我对此问题的解答: 命名 CSS 的类或 ID 时单词间如何连接? - 知乎 问题 CSS 类或 ID 命名时单词间连接通常有这几种写法: 驼峰式: solutionTitle.s ...
随机推荐
- hdu 5185(DP)
不错的一道dp题目,一开始想了一种N*N的dp,后面就一直想怎么优化,然后就一直都在坑中了. 这题题解还是看早了,应该再多想会的,多换种表示状态的方法再想想. dp[i][j]=dp[i-j][j]+ ...
- poj1676(转换为二进制求解)
题目链接:http://acm.hust.edu.cn/vjudge/problem/viewProblem.action?id=13175 题目关键:将0~9十个数转换为二进制数进行枚举比较 int ...
- POJ3487[稳定婚姻]
The Stable Marriage Problem Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 2974 Accepted ...
- jquery 模糊查询对象属性
1.如果你需要查询的对象属性id的值包含这样的值,你可以这样读取所有此条件的对象 $("input[id*='DiscountType']").each(function (i, ...
- 前端Js传递数组至服务器端
$("#delete").click(function () { var ID = ""; var ary = []; var bb = document.ge ...
- onload事件,解决不能在head写代码
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta http-equiv="con ...
- Python: names, values, assignment and mutability
推荐先看视频(youtube) Ned Batchelder - Facts and Myths about Python names and values - PyCon 2015 Change v ...
- JFrame上添加、删除Jpanel后动态显示界面问题
JFrame中动态添加或者删除JPanel后总是不正确显示需要的界面问题: 1.删除panel后还是显示之前的界面,新删除的panel在界面上并没有被删除: 2.删除panel1后添加新的panel2 ...
- Java栈和堆的区别
一.栈空间 1.栈空间存储数据效率高 2.栈中的数据是按“先进后出”的方式管理 3.栈空间存储空间比较小,不能存放大量的数据 4.JVM将基本类型的数据存放在栈空间 帮助理解 1.“客栈” 能提供很多 ...
- 面向对象之继承(Day24)
一.继承 1.什么是继承 继承是一种创建新类的方式,在Python中,新建的类可以继承一个或多个父类,父类又可称为基类或超类,新建的类称为派生类或子类 2.继承与抽象(先抽象再继承) 抽象基抽取类似或 ...