随笔 - 130  文章 - 1  评论 - 16  阅读 - 12万 

CSS圆角效果

    看了院子里一篇关于CSS圆角技巧的文章，试了一下，觉得很好，贴出练习的代码。优秀文章链接：

     http://www.cnblogs.com/luluping/archive/2010/06/26/1765616.html

    圆角效果：

   

  代码：

  

 

阴影效果：

   

代码：

 

2015.1.28深夜，看到上面以前写的代码，感觉后复杂，刚好看到一本书上介绍了圆角的简单画法，写在下面：（书名：《HTML与CSS入门经典》 by [美] Julie Meloni 这是一位女士）

复制代码
 1 <head runat="server">
 2     <title>创建圆角</title>
 3     <style type="text/css">
 4         .rounded
 5         {
 6             background: #00ff00;
 7             border-radius: 90px;
 8             height: 150px;
 9             width: 150px;
10         }
11         .rounded1
12         {
13             background: red;
14             border-radius: 50px;
15             height: 80px;
16             width: 80px;
17         }
18     </style>
19 </head>
20 <body>
21     <form id="form1" runat="server">
22     <div class="rounded">
23       
24     </div>
25     </form>
26 </body>
View Code
复制代码

效果图：

 

 

 

posted on   水语者9  阅读(201)  评论(0)  编辑  收藏  举报
编辑推荐：
· Linux系列：如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列：如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列（二）：开始使用ML.NET
阅读排行：
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
· 没有Manus邀请码？试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 无需6万激活码！GitHub神秘组织3小时极速复刻Manus，手把手教你使用OpenManus搭建本
· C#/.NET/.NET Core优秀项目和框架2025年2月简报
点击右上角即可分享
微信分享提示