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

css代码如下:
.demo{
position: absolute;
top:0;
height:100% ;
border:1px solid #000;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border-radius:15px;
}
个人觉得问题应该是样式设置不全,没有对溢出的样式进行处理,添加了overflow:hidden;问题解决,效果如图:

结合之前出现的一些问题,例如在div框中添加文字过多超出div框等,需要对overflow的情况做一些处理
CSS设置DIV边框为圆角,添加背景色溢出的问题的更多相关文章
- css美化Div边框的样式实例*(转载)
css美化Div边框的样式实例 很多时候如果不是用了很多样式,很难把边框修饰得好看,看了一篇博文,觉得真的挺漂亮,也挺好看. 转载的博文地址 将这段美化的css代码 border:1px soli ...
- 通过css代码使边框变圆角(ie9以下浏览器不支持)
(从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期2014-02-11) CSS代码: <style> #myDiv { border-radius: 4px; /*这句就是 ...
- Qt 之 设置窗口边框的圆角(使用QSS和PaintEvent两种方法)
Qt在设置窗口边框圆角时有两种方式,一种是设置样式,另一种是在paintEvent事件中绘制窗口.下面分别叙述用这两种方式来实现窗口边框圆角的效果. 一.使用setStyleSheet方法 this- ...
- css:设置div边框透明+渐变
写作背景: 觅兼职--登陆页面,UI给的原型图很漂亮,其中有一个图要求div外面有一圈透明度为0.37且带有渐变的边框.效果图如下: 在写的时候遇到了一点小小的问题:无法给同一个div设置圆角的透明+ ...
- 【转】CSS设置DIV背景色渐变显示
[原链接]http://www.2cto.com/kf/201310/248187.html <style type="text/css"> .linear{ ...
- CSS设置DIV背景色渐变显示
本文转载自:http://blog.csdn.net/gingerredjade/article/details/12191741 <style type="text/css" ...
- CSS设置DIV背景色渐变
div{ width: 200px; height: 200px; FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=, ...
- css美化Div边框的样式实例
很多时候如果不是用了很多样式,很难把边框修饰得好看,看了一篇博文,觉得真的挺漂亮,也挺好看. 转载的博文地址 将这段美化的css代码 border:1px solid #96c2f1;backgrou ...
- css 设置div基于父元素宽度的宽高相等的样式
1. 前言 在移动开发中,有时候需要设置一个宽高相等的div,并且为了使它能够适配更多的屏幕,于是需要让它的宽高和屏幕宽高成一定的比例.这里将提供一个css的解决方案,让一些后端开发不用再写繁琐的js ...
随机推荐
- 转 python测试框架最全资源汇总
转自: http://www.testclass.net/list/python_list_1/ xUnit frameworks(单元测试框架) frameworks 框架 unittest - p ...
- 新版Ubuntu安装日文输入法
在Ubuntu的设置中安装日文输入法 本周在调试书上代码时需要安装日文输入法,我发现在百度上并没有在最新版Ubuntu下安装日文输入法的教程,于是我写了这篇博客来与大家分享一下我的安装过程. a.如图 ...
- Git忽略提交规则 - .gitignore配置运维总结
在使用Git的过程中,我们喜欢有的文件比如日志,临时文件,编译的中间文件等不要提交到代码仓库,这时就要设置相应的忽略规则,来忽略这些文件的提交.简单来说一个场景:在你使用git add .的时候,遇到 ...
- JS中的三种弹出式消息提醒(警告窗口、确认窗口、信息输入窗口)的命令是什么?
一种: <a href="javascript:if(confirm('确实要删除该内容吗?')){location='http://www.google.com'}"> ...
- 20175303 2018-2019-2 《Java程序设计》第2周学习总结
•总体的说,第2周主要学习了课本第二章第三章的内容,这周的学习简直比上一周的简单而且容易理解得多.上周的各种安装,注册,眼花缭乱,很早就开始弄,但各种出错,到最后都想放弃了,好在有同学的帮助,帮我正确 ...
- 作业2:git使用
作业要求来自于:https://edu.cnblogs.com/campus/gzcc/GZCC-16SE2/homework/2097 远端库地址:https://github.com/yellow ...
- 合作开发工具——freeze和pipreqs
以后在合作开发的过程中,难免会用到别人开发到一半或者将自己开发的项目交给别人,在转交项目的时候需要让别人知道本项目中用到了哪些模块,这时可以用到一条命令来帮助我们. pip3 freeze # 获取环 ...
- 转载的web server实例
asp.net—web server模拟网上购物 2014-05-08 我来说两句 来源:asp.net—web server模拟网上购物 收藏 我要投稿 在学vb的时候学到了a ...
- smartctl 检测磁盘信息
smartctl -i 指定设备 -d 指定设备类型,例如:ata, scsi, marvell, sat, 3ware,N -a 或A 显示所有信息 -l 指定日志的类型,例如:TYPE: err ...
- windows程序设计 显示一个窗口
#include <windows.h> HINSTANCE hinst; LRESULT CALLBACK MainWndProc(HWND, UINT, WPARAM, LPARAM) ...