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

转载的博文地址

将这段美化的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代码的更多相关文章

  1. 一段自适应的CSS代码

    一段自适应HTML5的CSS代码,该代码在陕西特产使用过,手机端效果还好,就是PC端看起来没那么大气,比较窄屏 * { transition-property: all; -ms-transition ...

  2. 不容错过的20段CSS代码

    Web开发技术每年都在革新,浏览器已逐渐支持CSS3特性,并且网站设计师和前端开发者普遍采用这种新技术进行设计与开发.但仍然有一些开发者迷恋着一些CSS2代码. 分享20段非常专业的CSS2/CSS3 ...

  3. H5网页布局+css代码美化

    HTML5的结构化标签,对搜索引擎更友好 li 标签对不利于搜索引擎的收录,尽量少用 banner图片一般拥有版权,不需要搜索引擎收录,因此可以使用ul + li <samp></s ...

  4. 拥有的50个CSS代码片段(上)

    1. CSS 重置 ;;;font-size: 100%; font: inherit; vertical-align: baseline; outline: none; -webkit-box-si ...

  5. (转)每位设计师都应该拥有的50个CSS代码片段

    原文地址:http://www.cnblogs.com/fengyuqing/archive/2013/06/15/css_50.html 面对每年如此多的 新趋势 ,保持行业的领先是个很困难问题. ...

  6. 很实用的50个CSS代码片段

    原文:50 Useful CSS Snippets Every Designer Should Have          面对每年如此多的 新趋势 ,保持行业的率先是个非常困难问题. 站点设计者和前 ...

  7. 网站美化常见CSS

    伴随网络时代日新月异的发展,用户不仅仅满足于软件系统的功能需求,对软件系统的页面显示效果以及交互模式的要求也逐渐提高.尤其是展示性质的平台页面对于界面美化效果要求更高,有一句话说的好:Html是结构, ...

  8. 30+有用的CSS代码片段

    在一篇文章中收集所有的CSS代码片段几乎是不可能的事情,但是我们这里列出了一些相对于其他的更有用的代码片段,不要被这些代码的长度所吓到,因为它们都很容易实现,并且具有良好的文档.除了那些解决常见的恼人 ...

  9. CSS代码重构与优化之路

    作者:@狼狼的蓝胖子 网址:http://www.cnblogs.com/lrzw32/p/5100745.html 写CSS的同学们往往会体会到,随着项目规模的增加,项目中的CSS代码也会越来越多, ...

随机推荐

  1. MySQL:安装与配置

    记录一次 MySQL 在Windows系统的安装配置过程 安装MySQL 0.下载社区版安装包 官网下载地址:https://dev.mysql.com/downloads/installer/ 1. ...

  2. 给新手的 11 个 Docker 免费上手项目

    转: 给新手的 11 个 Docker 免费上手项目 作者:老K玩代码 来源:toutiao.com/i6882755471015576072 Docker 是一个开源的应用容器引擎,让开发者可以打包 ...

  3. 002-LED闪烁

    LED闪烁 功能:控制LED模块的小灯闪烁 #include<reg52.h> // 头文件 sbit LED = P2^0; // LED接低电平 void main() //主函数 { ...

  4. 剑指 Offer 51. 数组中的逆序对 + 归并排序 + 树状数组

    剑指 Offer 51. 数组中的逆序对 Offer_51 题目描述 方法一:暴力法(双层循环,超时) package com.walegarrett.offer; /** * @Author Wal ...

  5. Keytool 工具使用

    Keytool 管理私钥仓库(keystore)和与之相关的 X.509 证书链(用以验证与私钥对应的公钥),也可以用来管理其他信任实体 keytool 将密钥和证书存储在一个所谓的密钥仓库中,缺省的 ...

  6. MyBatis(四):自定义持久层框架优化

    本文所有代码已上传至码云:https://gitee.com/rangers-sun/mybatis 修改IUserDao.UserMapper.xml package com.rangers; im ...

  7. Jmeter +Jenkins +Ant 集成发送邮件报告

    [TOC] 一.什么是接口测试? 接口测试是测试系统组件间接口的一种测试.接口测试主要用于检测外部系统与系统之间以及内部各个子系统之间的交互点.测试的重点是要检查数据的交换,传递和控制管理过程,以及系 ...

  8. pyspider的环境安装

    第一:确认自己的Python版本3.6.x(因该版本与pyspider较为适应,其他版本易出错) 如果不是3.6版本的,且想将版本替换成3.6版本的有以下处理方法: 1.再装一个3.6版本python ...

  9. 攻防世界 reverse hackme

    hackme XCTF 3rd-GCTF-2017 __int64 __fastcall sub_400F8E(__int64 a1, __int64 a2) { char input[136]; / ...

  10. Java 给PPT添加动画效果(预设动画/自定义动画)

    PPT幻灯片中对形状可设置动画效果,常见的动画效果为内置的固定类型,即动画效果和路径是预先设定好的固定模板,但在设计动画效果时,用户也可以按照自己的喜好自定义动画动作路径.下面,通过Java后端程序代 ...