很多时候如果不是用了很多样式,很难把边框修饰得好看,看了一篇博文,觉得真的挺漂亮,也挺好看。

转载的博文地址

将这段美化的css代码

border:1px solid #96c2f1;background:#eff7ff

应用到div中,

<div style="padding:8px;border:1px solid #96c2f1;background:#eff7ff">&nbsp;border:1px solid #96c2f1;background:#eff7ff</div>

效果如下。

 border:1px solid #96c2f1;background:#eff7ff

以下还有十个示例。

 border:1px solid #9bdf70;background:#f0fbeb
 border:1px solid #bbe1f1;background:#eefaff
 border:1px solid #cceff5;background:#fafcfd
 border:1px solid #ffcc00;background:#fffff7
 border:1px solid #cee3e9;background:#f1f7f9
 border:1px solid #a9c9e2;background:#e8f5fe
 border:1px solid #e3e197;background:#ffffdd
 border:1px solid #adcd3c;background:#f2fddb
 border:1px solid #bfd1eb;background:#f3faff
 border:1px solid #a5b6c8;background:#eef3f7

不是说多么复杂,而是配色的确好看,嘻嘻。

css美化Div边框的样式实例的更多相关文章

  1. css美化Div边框的样式实例*(转载)

    css美化Div边框的样式实例   很多时候如果不是用了很多样式,很难把边框修饰得好看,看了一篇博文,觉得真的挺漂亮,也挺好看. 转载的博文地址 将这段美化的css代码 border:1px soli ...

  2. CSS设置DIV边框为圆角,添加背景色溢出的问题

    这么几天需要做一个类似于层级展示的东西,最后一层需要做一些div框来展示数据,我用css设置了div的边框为圆角,但是添加背景色的时候颜色溢出,覆盖了四个角的圆弧,效果如图所示: css代码如下: . ...

  3. css 给div 添加滚动条样式hover 效果

             css .nui-scroll { margin-left: 100px; border: 1px solid #000; width: 200px; height: 100px; ...

  4. css实现div内凹角样式

    平常的开发中我们一般使用到圆角都是外凸的,即border-radius属性.而如果有内凹角的情况,我们一般的考虑实现方法有2种.一种是直接使用背景图片,一种是使用css. 用到的属性则是backgro ...

  5. 美化Div的边框

    CSS修饰Div边框 大部分时候,Div的边框真的做的太丑了,如果不用很多样式来修饰的话,它永远都是那么的突兀.作为一个后端开发,前端菜鸡,在没有设计和前端开发自己独自做项目的时候常常会遇到Div边框 ...

  6. CSS样式实现溢出超出DIV边框宽度高度的内容自动隐藏方法

    CSS样式实现溢出超出DIV边框宽度高度的内容自动隐藏方法 平时我们布局时候,有的文字内容多了会超过溢出我们限制的高度,有的图片会撑破DIV,让网页错位变乱. 这样我们就需要解决如何使用CSS来超出设 ...

  7. 如何给div加一个边框border样式

    如何给div加一个边框样式? 对div盒子加一个边框样式很简单只需要使用border板块样式即可. 一.虚线与实线边框 边框虚线样式:dashed 边框实现样式:solid border:1px da ...

  8. div css仿京东订单流程图样式代码

    效果展示 http://hovertree.com/texiao/css/25/ 本效果适合PC,也适合移动端 手机扫描二维码查看效果: 效果图: 代码如下: <!DOCTYPE html> ...

  9. div 边框

    1.四个边框border-left 设置左边框,一般单独设置左边框样式使用border-right 设置右边框,一般单独设置右边框样式使用border-top 设置上边框,一般单独设置上边框样式使用b ...

随机推荐

  1. 【转】PHPCMS+PHPExcel实现后台数据导入导出功能

    首先,上图之中的红色框框是没有的,我们想要给他加上,当然是要改HTML页面啦,废话,我们跟ECSHOP一样由PHP路径找模板: 看看路由原理: 首先,上图之中的红色框框是没有的,我们想要给他加上,当然 ...

  2. 内网集群准同步shell脚本

    在公司的内网中配置集群同步,可能是代理问题,ntpd和chrony都没有用,所以只好写shell脚本解决 前提条件集群中各台机器已经配置好了免密登录 一.免密登录配置 1. 用 root 用户登录.每 ...

  3. thinkphp5框架生成二维码(二)

    上篇已经讲过了SDK之类的,这个不再重复,有不知道的童鞋们,请去看上篇文章吧. 这里我用的方法比较老旧,大家有更好的方法,可以进行改良,还有linux服务器,记得给文件权限,否则生成的文件会失败的.大 ...

  4. [T-ARA][Lovey-Dovey]

    歌词来源:http://music.163.com/#/song?id=22704426 作曲 : 新沙洞老虎/崔圭成 [作曲 : 新沙洞老虎/崔圭成] [作曲 : 新沙洞老虎/崔圭成] 作词 : 新 ...

  5. BZOJ 1901 Zju2112 Dynamic Rankings 树状数组套线段树

    题意概述:带修改求区间第k大. 分析: 我们知道不带修改的时候直接上主席树就可以了对吧?两个版本号里面的节点一起走在线段树上二分,复杂度是O((N+M)logN). 然而这里可以修改,主席树显然是凉了 ...

  6. ECharts之force力导向布局图——数据源说明及后端API约定

    Echarts ? 关于 Echarts 请移步这里 force 力导向图 实现方式,如: function require_EC () { require( [ 'echarts', //载入for ...

  7. 多源最短路——Floyd算法

    Floyd算法 问题的提出:已知一个有向网(或者无向网),对每一对定点vi!=vj,要求求出vi与vj之间的最短路径和最短路径的长度. 解决该问题有以下两种方法: (1)轮流以每一个定点为源点,重复执 ...

  8. Xftp安装和使用的视频录制方法

    内容: 1.使用工具 2.操作步骤及方法 视频地址: http://v.youku.com/v_show/id_XMzEwNjg2MTg2NA==.html?spm=a2h3j.8428770.341 ...

  9. 智能客服 利用python运行java代码

    因为需要在linux中用python来进行分析,顾需要利用python来运行java中语音转文字和文字转语音代码 在python中运行java代码需要利用jpype

  10. python 中如何计算时间差...

    Q:如何方便的计算两个时间的差,如两个时间相差几天,几小时等 A:使用datetime模块可以很方便的解决这个问题,举例如下: >>> import datetime>> ...