`
xinlingwuyu
  • 浏览: 138400 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

圆角的表格

阅读更多

<html>
<style type="text/css">
.rd{font-family: "宋体";font-size: 14px;height: 12px;width: 12px;margin: 0px;padding: 0px;line-height: 12px;}
#l{filter:DropShadow(Color=#00ccff,OffX=1,OffY=0)DropShadow(Color=#00ccff,OffX=1,OffY=0)DropShadow(Color=#00ccff,OffX=1,OffY=0)DropShadow(Color=#00ccff,OffX=1,OffY=0)DropShadow(Color=#00ccff,OffX=1,OffY=0)DropShadow(Color=#00ccff,OffX=1,OffY=0)DropShadow(Color=#00ccff,OffX=1,OffY=0);}
#r{filter:DropShadow(Color=#00ccff,OffX=-1,OffY=0)DropShadow(Color=#00ccff,OffX=-1,OffY=0)DropShadow(Color=#00ccff,OffX=-1,OffY=0)DropShadow(Color=#00ccff,OffX=-1,OffY=0)DropShadow(Color=#00ccff,OffX=-1,OffY=0)DropShadow(Color=#00ccff,OffX=-1,OffY=0);}
.tb{filter:DropShadow(Color=#cccccc,OffX=3,OffY=3);}#cn{font-family:"宋体";font-size: 14px;line-height:24px;}#en{font-family:"Verdana";font-size: 11px;}#ct{
 filter:DropShadow(Color=#ffffff,OffX=-1,OffY=-1)DropShadow(Color=#6699cc,OffX=1,OffY=1);
 position:relative;
 height:29px;
 width: 486px;
 left: 39px;
 top: 12px;
}body{overflow:hidden;background:#eeeeee;}
</style> <title>这是圆角的表格</title><body>
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="tb">
 <tr><td class="rd" id="l">╭</td>
 <td valign="bottom">
  <table width="100%" border="0" cellpadding="0" cellspacing="0">
   <tr><td bgcolor="#000000" height="1"></td></tr>
   <tr><td bgcolor="#00CCFF" height="7"></td></tr>
  </table>
 </td><td class="rd" id="r">╮</td></tr>
 <tr><td align="right">
 <table height="52" border="0" cellpadding="0" cellspacing="0">
  <tr><td width="1" bgcolor="#000000"></td><td bgcolor="#00CCFF" width="7"></td></tr>
 </table>
 </td><td bgcolor="#00CCFF" valign="top">
 <div id="ct">
        <label id="en"></label>
        <label id="en">www.blueidea.com </label>
        www.blueidea.comwww.blueidea.comwww.blueidea.com<br/>
  <label id="cn">欢迎进入蓝色理想</label>
        <label id="cn">www.blueidea.com</label>
      </div>
 </td><td align="left">
  <table height="52" border="0" cellpadding="0" cellspacing="0">
   <tr><td bgcolor="#00CCFF" width="6"></td>
   <td width="1" bgcolor="#000000"></td></tr>
  </table>
 </td></tr><tr><td class="rd" id="l">╰</td>
 <td valign="top">
  <table width="100%" border="0" cellpadding="0" cellspacing="0">
   <tr><td bgcolor="#00CCFF" height="5"></td></tr>
   <tr><td bgcolor="#000000" height="1"></td></tr>
  </table>
 </td><td class="rd" id="r">╯</td></tr>
</table>
</body> </html>

分享到:
评论

相关推荐

    表格美化-圆角表格 源代码

    圆角表格则是通过CSS样式来提升表格的视觉效果,使其看起来更加精致和现代化。本文将深入探讨如何使用HTML和CSS实现圆角表格,以及解析提供的源代码。 首先,我们要明白圆角表格的核心在于CSS的`border-radius`属性...

    用CSS样式定义的圆角表格

    通过分析提供的文件信息,我们可以提炼出以下几个与CSS样式定义的圆角表格相关的知识点: ### CSS样式定义圆角表格的关键技术点 #### 1. **HTML结构** - 在本示例中,圆角表格主要是通过一个`&lt;div&gt;`元素来实现的...

    div css圆角代码各种圆角表格_圆角边框css圆角

    本篇文章将深入探讨如何使用 `div` 和 `CSS` 实现各种圆角表格和圆角边框。 首先,我们了解 `div` 元素。`div` 是一个通用的容器元素,用于组合网页上的其他元素。通过应用样式,我们可以让 `div` 元素呈现不同的...

    网页中制作精美圆角表格

    ### 网页中制作精美圆角表格 在网页设计中,通过添加圆角效果可以使网页元素更加柔和、美观,从而提升用户体验。本文将详细介绍两种常见的制作圆角表格的方法:一是利用图片制作圆角表格;二是利用VML技术实现。 #...

    超简单!使用CSS制作圆角表格 3步搞定

    其中,制作圆角表格是一项常见的需求,尤其在追求现代感与用户友好体验的设计中。本文将详细介绍如何通过简单的三步骤,利用CSS来实现圆角表格的制作。 ### 第一步:设置基本CSS样式 首先,我们需要定义一些基本的...

    圆角表格的实现

    在这个"圆角表格的实现"的示例中,我们将探讨如何在ASP.NET环境中,利用JavaScript在VS2005中创建圆角表格。 首先,我们需要理解圆角表格的基本原理。在HTML中,表格是由`&lt;table&gt;`、`&lt;tr&gt;`(行)、`&lt;td&gt;`(单元格)...

    圆角表格代码

    ### 圆角表格代码解析与实现 #### 一、概述 在HTML中,可以通过一系列复杂的嵌套表格结构来实现带有圆角效果的表格布局。这种技术在过去被广泛应用于Web设计中,尤其是在CSS还不足以支持复杂布局的情况下。本文将...

    vml实现圆角表格

    本文将深入探讨如何使用VML来实现圆角表格,这是一种在没有现代CSS3圆角边框支持的情况下实现圆角效果的技术。 首先,我们需要了解VML的基本结构。VML使用XML语法,每个图形元素如矩形、线、弧线等都是一个独立的...

    圆角表格

    标题中的“圆角表格”指的是在网页或应用中使用CSS样式来实现表格边框具有圆润效果的技术。这种设计可以使用户界面看起来更加现代、友好,减少尖锐边缘带来的视觉冲击,提升整体美感。在Web开发中,实现圆角表格通常...

    无图片的圆角表格.rar

    在这个"无图片的圆角表格"项目中,开发者可能使用了JavaScript来动态计算和调整表格的样式,确保每个单元格的角部都能呈现出圆润的效果。这可能涉及到对表格结构的深入理解,包括行、列、单元格之间的关系,以及如何...

    无图片的圆角表格

    无图片的圆角表格

    PHP快速输出圆角表格GIF格式图片插件.rar

    插件用于创建圆角表格所需要的角和边GIF图像。 2.插件说明: 若创建成功一个GD图像,它代表生成的GIF图像,若创建失败,则返回一个未知量或一个位置图像。 它需要以下参数: $corner 创建图像的标识符,取tl、t...

    CSS 用ul li做圆角表格

    这两天和表格纠结上了…工作需要做表格,但是不想重复相同的方法,前两天用dl dt dd,今天用ul li做个圆角表格,圆角用了背景图片。再次声明:数据输出型的表格不推荐使用div+css。测试浏览器:IE6\IE7\IE8\FF3.0\...

    用&amp;lt;TABLE&amp;gt;语句来实现圆角表格可以省去制作圆角图片之苦!

    接下来,我们可以通过CSS样式来实现圆角表格。CSS样式属性可以应用于标签,例如设置表格宽度、边框样式、单元格间距等。这些属性包括: 1. width:设置表格的宽度,可以是百分比也可以是具体的像素值。 2. border:...

    无图片的圆角表格特效代码

    标题“无图片的圆角表格特效代码”暗示了我们要探讨的是如何在网页设计或编程中创建具有圆角的表格,而无需使用图片作为装饰。在现代网页开发中,这种效果通常通过CSS(Cascading Style Sheets)来实现,因为CSS3...

    纯CSS3漂亮表格(圆角、渐变、多背景色).rar

    在CSS3之前,创建圆角表格需要使用复杂的图片或者JavaScript技巧。但CSS3引入了`border-radius`属性,使得我们可以直接通过代码设置元素边框的圆角大小,这大大简化了设计过程。对于表格单元格(`td`或`th`),可以...

    使表格边框变圆角的技术

    在网页设计中,让表格边框呈现出圆角效果可以增加界面的美观度和用户体验。"使表格边框变圆角的技术"主要涉及到HTML、CSS以及JavaScript的运用,尤其是在不支持CSS3的老版本浏览器中,可能需要借助JavaScript库来...

    网页表格特效大集合(附源码)

    在本篇文章中,我们将探讨一些独特的表格特效,包括细线表格、立体表格以及另类圆角表格的制作方法,这些特效能提升网页的视觉吸引力和用户体验。 1. 细线表格 细线表格通常用于提供简洁、无干扰的数据展示。这里有...

Global site tag (gtag.js) - Google Analytics