简洁型css圆角矩形

于 2013-04-18 15:07:14 发布
阅读量642 收藏
点赞数
分类专栏： css div 文章标签： 简洁型css圆角矩形
css 同时被 2 个专栏收录
5 篇文章 0 订阅
订阅专栏
div
5 篇文章 0 订阅
订阅专栏



<!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=utf-8" />
<title>无标题文档</title>

<style type="text/css">

.b1,.b2,.b3,.b4,.b1b,.b2b,.b3b,.b4b,.b{display:block;overflow:hidden;}

.b1,.b2,.b3,.b1b,.b2b,.b3b{height:1px;}

.b2,.b3,.b4,.b2b,.b3b,.b4b,.b{border-left:1px solid #999;border-right:1px solid #999;}

.b1,.b1b{margin:0 5px;background:#901e78;}

.b2,.b2b{margin:0 3px;border-width:2px;}

.b3,.b3b{margin:0 2px;}

.b4,.b4b{height:2px;margin:0 1px;}

.d1{background:#901e78;}

.k {height:auto;}
.b ul{padding:0px;margin:0px;}
.b ul li{/*background:url(../images/a_03.jpg) no-repeat;*/float:left;line-height:40px;width:120px;height:40px;font-size:16px;text-align:center;}


</style>

</head>



<body>

<div >

<b class="b1"></b><b class="b2 d1"></b><b class="b3 d1"></b><b class="b4 d1"></b>

<div class="b d1 k">
   <ul>
           <li><a href="<%=webfolder%>c_info/" class="bi">关于我们<span>About</span></a></li>
           <li><a href="<%=webfolder%>c_products" class="bi">婚礼作品<span>Wedding Photos</span></a></li>
           <li><a href="<%=webfolder%>c_html_infoxy/guanyuwomen.html" class="bi">服务流程<span>service process</span></a></li>
           <li><a href="<%=webfolder%>c_news" class="bi">新闻中心<span>News</span></a></li>
           <li><a href="<%=webfolder%>c_infoxy/" class="bi">联系我们<span>Contact Us</span></a></li>

  </ul>
</div>

<b class="b4b d1"></b><b class="b3b d1"></b><b class="b2b d1"></b><b class="b1b"></b>

</div>
Lvy2011
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
css 绘制带尖角的矩形
weixin_44176432的博客
11-06 1531
不能使用组件解决，需要写出一个类似气泡的矩形。 如图： 矩形带尖角的 实现图示的效果涉及到的知识主要有两点：一个是before、after伪元素，一个是border 1、before 和 after 都是css中的伪元素，他们俩用法都差不多，通过给定一个属性content给元素添加新的内容，不同的是before用来在元素前插入新内容，after用来在元素后面插入新内容。 比如有一个p元素：水 水...
纯css编写圆角矩形框
Capgras的博客
04-28 444
效果图 html代码： <div id="box"> <div class="radius"> <div class="r1"></div> <div class="r2"></div> <div class="r3"></div> ...
各种css圆角矩形代码
yanwei4444的专栏
01-19 1510
各种css圆角矩形代码 http://www.aspprogram.cn 0:50:56 121wang 通常使用图片做圆角矩形的时候，如果直接将圆角矩形作为背景图片，如果页面上很多处都是这样使用的，这样就会影响网站打开速度，遇到背景图片自动增加那种，就不能实现了。 如果将圆角矩形分割成上中下三个，可实现背景自动增加，但要实现这个效果，需要将圆角矩形分割成三个图片或更多，图片用的过多，影响...
CSS圆角矩形
董斌的专栏
12-18 833
DIV+CSS圆角边框 简洁型css圆角：  方法1： 简洁型css圆角矩形   code1:   按 Ctrl+C 复制代码 按 Ctrl+C 复制代码   方法2：   无图片实现圆角框   code2:   style type="text/css"> div.RoundedCorner{background:#9
div+css用边框实现圆角矩形(多样式)
09-25
首先，让我们看看简洁型CSS圆角矩形的实现。这种方法是通过嵌套`<b>`元素和设置不同边框来达到圆角效果。例如，代码1中，`.b1`到`.b4b`类分别定义了不同边框宽度和颜色，通过调整它们的位置和大小，形成一个完整的...
使用Div+CSS纯图片实现圆角矩形的方法小结
12-13
在网页设计中，使用Div+CSS纯图片实现圆角矩形是一种常见的技术，尤其是在CSS3的圆角边框属性还未普及或需要兼容老版本浏览器时。这种方法通过巧妙地利用图片和CSS布局，能够创建出带有圆角的效果。下面将详细阐述几...
WPF圆角矩形.zip
04-30
这个“WPF圆角矩形.zip”压缩包可能包含了一个简单的WPF应用示例，展示了如何利用C#编程和XAML来实现类似小米新Logo的圆角矩形效果。 标题中的“WPF圆角矩形”指的就是在WPF环境中，使用XAML来创建具有圆角的矩形...
CSS 圆角框进行JS封装版
09-25
本文就是基于这样的需求，对CSS圆角框进行JS封装，使得圆角框的创建更加便捷。 首先，JS封装的优点在于可以动态地处理DOM元素，包括img标签，从而实现图片的圆角化。在纯CSS方法中，由于CSS无法直接作用于img标签...
pi_heif-0.17.0-cp39-cp39-manylinux_2_31_armv7l.whl
最新发布
07-27
pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。
ubuntu20.04-ssh9.8p1-ssl3.0.14-focal-deb-amd64升级加固脚本.zip
07-27
若有新版本请查看文章最后附件地址：https://blog.csdn.net/liuxin638507/article/details/132450367 特点： 1、同时升级openssh与openssl，采用deb包形式，一键快速升级版本，无需每台单独再次进行编译， 2、隐藏openssh-版本号(openssh9.8p1及之后隐藏版本号还未找到方法) 3、已默认安全加固（已有配置跳过） 安装： 执行 bash upgrade_ssl_ssh_ubuntu.sh 进行安装 注意，升级安装后，确保sshd服务正常，请新开终端进行验证测试 验证 openssl版本： openssl version OpenSSL 3.0.14 4 Jun 2024 (Library: OpenSSL 3.0.14 4 Jun 2024) openssh版本： ssh -V OpenSSH_9.8p1, OpenSSL 3.0.14 4 Jun 2024
avif-0.5.0-cp36-cp36m-manylinux1_i686.whl
07-27
python库，可以直接安装使用，再也不怕自己pip下载，出现等待超时的现象。欢迎下载使用，使用过程中如有使用问题，请及时与我沟通交流，帮你解决！ python库，可以直接安装使用，再也不怕自己pip下载，出现等待超时的现象。欢迎下载使用，使用过程中如有使用问题，请及时与我沟通交流，帮你解决！ python库，可以直接安装使用，再也不怕自己pip下载，出现等待超时的现象。欢迎下载使用，使用过程中如有使用问题，请及时与我沟通交流，帮你解决！ python库，可以直接安装使用，再也不怕自己pip下载，出现等待超时的现象。欢迎下载使用，使用过程中如有使用问题，请及时与我沟通交流，帮你解决！ python库，可以直接安装使用，再也不怕自己pip下载，出现等待超时的现象。欢迎下载使用，使用过程中如有使用问题，请及时与我沟通交流，帮你解决！
教务管理系统-毕业设计.zip
07-27
教务管理系统-毕业设计.zip
pillow_jxl_plugin-1.2.5-cp39-none-win_amd64.whl
07-27
基本介绍 名称与起源：Pillow，原名为PIL（Python Imaging Library），但PIL只支持Python 2版本。随着Python 3的普及，Pillow作为PIL的一个分支出现，兼容Python 3并提供更多的功能和改进。 主要功能：Pillow支持多种图像格式的打开、保存、显示以及基本的图像操作和处理，如裁剪、缩放、旋转、翻转、滤镜应用等。 跨平台性：Pillow库可以在不同的操作系统上运行，包括Windows、Linux和MacOS等。 主要功能模块 Pillow库包含多个功能模块，每个模块都提供了特定的图像处理功能。以下是一些常用的模块： Image：用于处理图像文件，提供打开、保存、调整大小、旋转、裁剪、滤镜等功能。 ImageDraw：提供在图像上绘制各种形状（如线条、矩形、圆形）和文本的功能。 ImageFont：用于加载和使用TrueType字体文件，以便在图像上绘制文本时设置字体样式、大小和颜色。 ImageFilter：提供各种滤镜效果，如模糊、锐化、边缘增强等，用于图像增强、特效处理和图像识别等应用。 ImageEnhance：用于调整图像的亮度、对比度、颜色饱和度等参数，使图像更加清晰、明亮或具有特定的调色效果。 高级功能 除了基本的图像处理功能外，Pillow还支持一些高级功能，如色彩空间转换、直方图均衡化等。这些功能可以帮助用户进行更复杂的图像处理和分析。
pi_heif-0.17.0-cp38-cp38-win_amd64.whl
07-27
pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。
[毕设]高效人事考勤管理系统.zip
07-27
[毕设]高效人事考勤管理系统
人力资源培训.HR如何与业务部门进行沟通.ppt
07-27
人力资源培训.HR如何与业务部门进行沟通.ppt
毕业设计：基于Springboot的健身俱乐部网站 PPT
07-27
随着社会发展，健身俱乐部的管理面临日益严峻的挑战。众多用户倾向于通过互联网获取信息，但健身相关信息繁杂且真伪难辨。为便于用户更有效地获取本健身俱乐部的管理信息，设计一个既安全又高效的官方网站显得尤为重要。 本文旨在打造一个安全、简洁的健身俱乐部网站，助力用户快速查找健身课程、健身器材、会员卡详情及新闻公告等信息，以解决当前健身俱乐部管理信息混乱、难以辨识的问题。该系统基于Spring Boot架构技术，运用Java编程语言与MySQL数据库进行开发设计。通过对健身俱乐部业务流程的深入分析，我们明确了其功能性和非功能性需求，并据此设计了包含个人用户、管理员和教练三大模块的健身俱乐部网站。 此系统不仅为用户提供了一个便捷实用的健身俱乐部在线平台，使他们能够迅速找到适合自己的健身俱乐部，还允许用户浏览健身课程和器材信息，并支持在线留言功能。同时，管理员可通过后台管理系统轻松管理用户和教练的信息，亦能发布在线留言，以便用户及时获取最新的健身课程信息。如此，用户便能安全、高效地获取健身俱乐部的管理信息。
HTML5 Canvas 2.0绘图库：新增正圆角矩形绘制函数
在1.0版本的基础上，作者针对开发者的需求进行了扩展和优化，旨在简化Web开发者的绘图工作，特别是在创建具有圆角矩形的复杂图形时。 新增的核心函数之一是`DrawRoundRect`，它接受四个参数：Canvas对象，矩形的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值