<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GB2312"/>
<title></title>
<style type="text/css">
html,body{
font-size:12px;
}
.round_border,.round_border b{
display:block;
text-align:center;
}
.round_border_layer3,.round_border_layer2,.round_border_layer1,
.round_border_content{
border:1px solid #c4c4c4;
border-width:0 1px 0 1px;
height:1px;
overflow:hidden;
}
.round_border_layer3{
margin:0 3px;
background:#c4c4c4;
}
.round_border_layer2{
margin:0 2px;
}
.round_border_layer1{
margin:0 1px;
}
.round_border_content{
height:30px;
padding:3px 6px;
}
/*only for better appearance, not necessary, http://wallimn.iteye.com*/
.round_border_layer2,.round_border_layer1{
border-color:#d3d4d5;
}
/*******************control bar**********************/
.controlbar_border_layer3,.controlbar_border_layer2,.controlbar_border_layer1,
.controlbar_border_content{
background:#e9e9e9;
height:1px;
overflow:hidden;
}
.controlbar_border_layer3{
margin:0 3px;
}
.controlbar_border_layer2{
margin:0 2px;
}
.controlbar_border_layer1{
margin:0 1px;
}
.controlbar_border_content{
height:20px;
padding:0 1em;
line-height:20px;
vertical-align:middle;
}
/*only for better appearance, not necessary, http://wallimn.iteye.com*/
.controlbar_border_layer1,..controlbar_border_layer2{
border-color:#f2f2f2;
}
</style>
</head>
<body>
<div style="width:260px;">
<b class="round_border">
<b class="round_border_layer3"></b>
<b class="round_border_layer2"></b>
<b class="round_border_layer1"></b>
</b>
<div class="round_border_content">
<b class="round_border">
<b class="controlbar_border_layer3"></b>
<b class="controlbar_border_layer2"></b>
<b class="controlbar_border_layer1"></b>
</b>
<div class="controlbar_border_content">
隔壁老王
</div>
<b class="round_border">
<b class="controlbar_border_layer1"></b>
<b class="controlbar_border_layer2"></b>
<b class="controlbar_border_layer3"></b>
</b>
</div>
<div class="round_border_content">
<b class="round_border">
<b class="controlbar_border_layer3"></b>
<b class="controlbar_border_layer2"></b>
<b class="controlbar_border_layer1"></b>
</b>
<div class="controlbar_border_content">
隔壁老王
</div>
<b class="round_border">
<b class="controlbar_border_layer1"></b>
<b class="controlbar_border_layer2"></b>
<b class="controlbar_border_layer3"></b>
</b>
</div>
<b class="round_border">
<b class="round_border_layer1"></b>
<b class="round_border_layer2"></b>
<b class="round_border_layer3"></b>
</b>
</div>
</body>
</html>
分享到:
相关推荐
圆角按钮宽度自适应 自适应宽度的CSS圆角背景的按钮
css 圆角样式,用css编写的圆角,而不是把圆角的背景切下来,当作背景图片!
CSS3完美支持IE圆角阴影样式是一款基于jquery css3实现的圆角样式代码。
WPF/C#中的ListView、ListBox的背景样式、 选中行样式,可自定义选中行项的背景颜色、圆角、方形等任意形状的背景以及前景色!以ListView为例说明,使用时如下: ...
自适应自动跳转样式,修改样式,圆角,边框,背景,颜色等 2、使用说明 引入: <script src="./js/sliderVerif.js"></script> 4、可用方法 重置方法 : reset() 更新样式方法 : upStyle() ,屏幕变化,会导致px...
本仓库是iOS端的weex富文本组件。本质上是一个UITextView,用于将HTML字符串解析成NSAttributedString。
elementUI给table表头行设置背景颜色样式
使用div+css样式呈现圆角层 不需要背景图片 用div层与样式来实现圆角层的
下拉圆角导航菜单
VML是The Vector Markup Language(矢量可标记语言),原本是微软自己开发的东西,很强大。也就是说,IE下面,可以用 VML做出圆角 。半透明、阴影 、渐变背景。
css样式 特殊效果 圆角 浮动 弹窗 渐变色背景 css样式 特殊效果 圆角 浮动 弹窗 渐变色背景
GitHub地址: https://github.com/JohnnyHooo/HJViewStyle 特点: xib零代码和代码快速设置View各种样式 阴影和圆角并存 渐变色背景 根据主题色快速设置渐变背景色 pod 'HJViewStyle'
一款可用背景图做的按钮,图片使用圆角,大家可以定做图片,修改样式等。。。。图片按钮,漂亮美观大方按钮
开发环境:python3.7 + pyqt5 开发说明文章参见我的博文: python小技巧大应用--基础实用漂亮界面(无边框,圆角,可拖拽) ...2.漂亮的背景界面,圆角,无边框 3.支持鼠标拖拽,最小化,关闭功能 4.支持qss样式设置
一组用VC .NET实现的圆角按钮特效,实例集,不只一种圆角按钮,十分漂亮,特别是边框样式都不同,另外还有按钮的背景色也是不一样的,有兴趣的先看下源码素材网的测试截图,看是不是你喜欢的圆角风格?
一款强大的TextView工具类,定制各种样式,背景圆角,填充色,边框,显示效果一句搞定
android shape可以帮助我们实现很多的效果,比如:圆角、虚线边框、部分圆角、颜色的渐变等效果,同时源文件给出了android4.0系统下虚线会变成实线的解决办法。
源码可直接编译运行,自定义QPushButton样式,通过选择背景渐变、边框、字体、字号、鼠标移入移出切换、点击态、圆角设置等自动生成样式code,然后调用setStyleSheet()。
本项目为Qt实现图标生成器, 支持ico,png,jag,jpeg,bmp图标编辑,主要编辑图标背景色,圆角,填充距离,透明度等。支持主题切换,拖拽上传,导出格式,导出大小等 内置三款主题,可动态切换,全局主题可css文件...
前不久做项目,要用到大量的页面圆角的框块,以前实现的时候都是用图片做背景之类的方法,那种方法对于少数的还是比较可行的,但是当涉及到整个项目都要用 到这样的效果时就显得不够优化和简练了。