如何给div加一个边框border样式
如何给div加一个边框样式?
对div盒子加一个边框样式很简单只需要使用border板块样式即可。
一、虚线与实线边框
边框虚线样式:dashed
边框实现样式:solid
border:1px dashed #000
代表设置对象边框宽度为1px黑色虚线边框
border:1px solid #000
代表设置对象边框宽度为1px黑色实现边框
二、对div上边加边框
我们给div上边加1px黑色边框
div{border-top:1px solid #}
三、给div底部加边框
给div盒子底部加2px虚线红色边框
div{border-bottom:2px dashed #F00}
四、在div盒子左侧加边框
给一个css选择器 css命名为“.divcss5”盒子左侧加一个蓝色1px实线边框
.divcss5{ border-left:1px solid #00F}
DIV代码:
<div class="divcss5">此DIV盒子左侧为1px实线蓝边框</div>
五、在盒子div右侧加边框
div对象右侧加1px红色实线边框
div{ border-right:1px solid #F00}
六、在盒子上下加边框
给盒子上下加1px实现黑色边框
div{border-top:1px solid #;border-bottom:1px solid #}
七、给div盒子左右加边框
给盒子左右加2px虚线绿色边框
div{ border-left:2px dashed #0F0;border-right:2px dashed #0F0}
八、给div四边加上一个边框
给一个DIV四边加上3px实现黑色边框
div{ border:3px solid #}
以上是如何给一个div加边框,各种加边框样式方法教程。根据需要对选择器进行重新命名,即可使用class或id在html的div引入调用,灵活运用并掌握对一个对象加边框样式方法。
如何给div加一个边框border样式的更多相关文章
- 理解CSS边框border
前面的话 边框是CSS盒模型属性中默默无闻的一个普通属性,CSS3的到来,但得边框属性重新焕发了光彩.本文将详细介绍CSS边框 基础样式 边框是一条以空格分隔的集合样式,包括边框粗细(边框宽度 ...
- 纯CSS实现tooltip提示框,CSS箭头及形状之续篇--给整个tooltip提示框加个边框
在前面一篇中我们介绍了纯CSS实现tooltip提示框,通俗的讲也就是CSS箭头及形状 不过注意一点是,他始终是一个元素,只是通过CSS实现的,今天我们要说的是给这个“tooltip提示框”整体加一个 ...
- html div 加边框样式
边框虚线样式:dashed边框实现样式:solid border:1px dashed #000代表设置对象边框宽度为1px黑色虚线边框 border:1px solid #000代表设置对象边框宽度 ...
- div加边框
一.虚线与实线边框 边框虚线样式:dashed 边框实现样式:solid border:1px dashed #000 代表设置对象边框宽度为1px黑色虚线边框 border:1px solid #0 ...
- Bootstrap3基础 img-thumbnail 给图片加一个圆角的边框
内容 参数 OS Windows 10 x64 browser Firefox 65.0.2 framework Bootstrap 3.3.7 editor ...
- css美化Div边框的样式实例
很多时候如果不是用了很多样式,很难把边框修饰得好看,看了一篇博文,觉得真的挺漂亮,也挺好看. 转载的博文地址 将这段美化的css代码 border:1px solid #96c2f1;backgrou ...
- css美化Div边框的样式实例*(转载)
css美化Div边框的样式实例 很多时候如果不是用了很多样式,很难把边框修饰得好看,看了一篇博文,觉得真的挺漂亮,也挺好看. 转载的博文地址 将这段美化的css代码 border:1px soli ...
- DIV+CSS颜色边框背景等样式
1.使用css缩写 使用缩写可以帮助减少你CSS文件的大小,更加容易阅读.css缩写的主要规则请参看<常用css缩写语法总结>,css缩写的主要规则如下: 颜色 16进制的色彩值,如果每两 ...
- word中几个好用的宏代码(立方米上标、关闭样式自动更新、删除无效样式、表格加粗边框、宋体引号)
Sub 替换立方米() With Selection.Find .Text = "m3" .Replacement.Text = "mm3" .Forward ...
随机推荐
- Android 颜色渲染(一) 颜色选择器 ColorPickerDialog剖析
版权声明:本文为博主原创文章,未经博主允许不得转载. Android 颜色选择器之ColorPickerDialog剖析 有这样一个需求,可以让用户自定义背景颜色,这就需要提供一个颜色选择器给用户. ...
- redundant 行记录格式
CREATE TABLE `mytest2` ( `t1` varchar() DEFAULT NULL, `t2` varchar() DEFAULT NULL, `t3` ) DEFAULT NU ...
- tcmalloc源码剖析的资料
1. https://seanhn.wordpress.com/2011/04/14/exploit-necromancy-in-tcmalloc-reviving-the-4-to-n-byte-o ...
- GRADLE 构建最佳实践
随着谷歌对Eclipse的无情抛弃和对Android Studio的日趋完善,使用gradle构建Android项目已经成为开发者的一项必会良技.那么,问题来了,采用什么样的姿势才能让项目开发构建过程 ...
- Java基础知识强化之集合框架笔记15:List集合的特点
1. List集合的特点 List本身也是一个接口,如下: public interface List<E> extends Collection<E> (1)List是有序的 ...
- iOS Multiview Applications
@import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css); @import url(/ ...
- DOM - nodeType 的取值
DOM 中,共有 12 中不同类型的节点,nodeType 的取值以数值表示. 节点类型 描述 子节点 1 Element 表示元素. Element, Text, Comment, Proce ...
- ip接口调用
<?php header("Content-type: text/html; charset=utf-8"); function getIP(){ if (isset($_S ...
- vs里 .sln和.suo 文件
Net解决方案下 .sln文件和.suo文件的解释:When a Web site is created, a solution file (.sln) and a hidden solution u ...
- Java设计模式(学习整理)---单例模式
1.概念: java中单例模式是一种常见的设计模式,单例模式分三种:懒汉式单例.饿汉式单例.登记式单例三种. 单例模式有一下特点: 1.单例类只能有一个实例. 2.单例类必须自己自己创建自己的唯一实例 ...