博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
美化Div的边框
阅读量:6655 次
发布时间:2019-06-25

本文共 777 字,大约阅读时间需要 2 分钟。

CSS修饰Div边框


大部分时候,Div的边框真的做的太丑了,如果不用很多样式来修饰的话,它永远都是那么的突兀。作为一个后端开发,前端菜鸡,在没有设计前端开发自己独自做项目的时候常常会遇到Div边框过于丑陋导致界面看上去很不美观的情况,总结了三大法宝来应对它

整齐就是美

在没有设计参与的情况下,尽量把页面做的整洁明了,如果没有明确的要求,就用浅色调,在各Div对齐有序情况下不会很难看。

设计风格统一

当你确定使用一个色调以后就把所有的边框颜色,背景颜色都往这个颜色靠近(注意不能太过相似,需要有区分度,可是又不能带来太大的视觉冲击),这样设计出来的网页较为简洁,设计上不会太丑

使用CSS来美化Div的边框

先来写一个美化边框的CSS代码:

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

将这段CSS代码应用在Div上,产生边框效果,代码如下:

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

生效后效果如下:

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

下面再节选几个已经美化好的Div边框样式,可根据自己的网页风格选择使用:

 border:1px solid #96c2f1;background:#f0fbeb>

 border:1px solid #96c2f1;background:#eefaff>

 border:1px solid #cceff5;background:#fafcfd>

 border:1px solid #ffcc00;background:#fffff7>

转载于:https://www.cnblogs.com/QuixoteY/p/10902147.html

你可能感兴趣的文章
java数据类型有哪几种_java数据类型有哪些
查看>>
java 空对象_Java中的空对象模式
查看>>
java课程设计 计算器_Java课程设计-计算器
查看>>
java 什么是内部类_什么是JAVA内部类?
查看>>
java web套打_XMReport-提供web项目Java套打解决方案
查看>>
java获取图片分辨率_java获取远程图片分辨率
查看>>
java label 超链接_java – 如何在JLabel中添加超链接?
查看>>
java foreach 源码_java Foreach与迭代器(示例代码)
查看>>
java http请求分发_Java实现利用HttpClient和配置文件实现集群模式下的文件同步分发-Go语言中文社区...
查看>>
java log4j 使用_java日志之log4j简单使用
查看>>
java oracle分页查询语句_oracle 分页语句
查看>>
java 连接sqlserver_java连接sqlserver报错
查看>>
mysql元数据同步_MySQL 元数据
查看>>
java 事务面试_java中关于java事务的面试要点
查看>>
java宝典_Java宝典(三)
查看>>
java选_java基础笔记(七)——java选择结构
查看>>
2017java软件开发_201671010114 2016-2017-2《Java程序设计》Java的设计环境
查看>>
java非jsp_java – JSTL / JSP EL(表达式语言)在非JSP(独立)上下文中
查看>>
java垃圾回收是系统级线程_JAVA的垃圾回收机制
查看>>
java程序设计基础第七章_Java语言程序设计(基础篇) 第七章 一维数组
查看>>