<!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>

<title></title>

<style type="text/css">

*{ margin:0; padding:0;}

.box{ width:350px; height:500px; background:#999; padding-top:60px; padding-left:60px;}

.box li{ float:left; list-style:none}

.box li a{ border:5px solid #aaa; display:block; width:100px; height:60px; text-decoration:none; margin:0 0 -5px -5px; position:relative; z-index:0; text-align:center; line-height:60px; color:#fff; font-size:30px;}

.box li a:hover{ border:5px solid #333; z-index:1;}

</style>

</head>

<body>

<ul class="box">

<li><a href="#">1</a></li>

<li><a href="#">2</a></li>

<li><a href="#">3</a></li>

<li><a href="#">4</a></li>

<li><a href="#">5</a></li>

<li><a href="#">6</a></li>

<li><a href="#">7</a></li>

<li><a href="#">8</a></li>

<li><a href="#">9</a></li>

<li><a href="#">10</a></li>

<li><a href="#">11</a></li>

<li><a href="#">12</a></li>

<li><a href="#">13</a></li>

<li><a href="#">14</a></li>

<li><a href="#">15</a></li>

</ul>

</body>

</html>

效果图

CSS表格均匀边框的更多相关文章

  1. CSS - 表格细线边框

    通过 border-collapse: collapse cellpadding="0", cellspacing= "0" 实现 <!DOCTYPE h ...

  2. 用css样式，为表格加入边框

    Table 表格在没有添加 css 样式之前,是没有边框的.这样不便于我们后期合并单元格知识点的讲解,所以在这一节中我们为表格添加一些样式,为它添加边框. 在右侧代码编辑器中添加如下代码: <s ...

  3. 表格细边框的两种CSS实现方法

    在网页制作中,细边框这个制作方法是必不可少的.这里介绍2种常见的表格细边框制作方法,均通过XHTML验证. <!DOCTYPE html PUBLIC "-//W3C//DTD XHT ...

  4. 用CSS给表格加边框

    很久之前,给表格加边框用的方法是给表格加上背景色,然后把cellspacing="1",再给td设置成另一种颜色,这样间接的加边框颜色. 一直没去细研究,今天发现了一种很简单的加边 ...

  5. CSS操作表格的边框和表格的属性示例代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. 第 18 章 CSS 表格与列表

    学习要点: 1.表格样式 2.列表样式 3.其他功能 主讲教师:李炎恢 本章主要探讨 HTML5 中 CSS 表格和列表,通过表格和列表的样式设置,让表格和列表显示更加多元化. 一．表格样式 表格有五 ...

  7. HTML 学习笔记 CSS(表格)

    CSS 表格属性可以帮助您极大的改善表格的外观 表格边框 如需在CSS中设置表格的边框 请使用border属性. 在下面的例子中table th 以及td设置了蓝色边框. table, th, td ...

  8. border-collapse实现表格细线边框

    虽然在xhtml+css 时代 table的使用越来越少,但需要布局数据型元素,用table还是很不错的选择. 用table制作表格的时候美观也很重要,其中的边框.在HTML中,表格的默认样式大概是这 ...

  9. Bootstrap css栅格 + 网页中插入代码+css表格

    设计达人 http://www.shejidaren.com/30-minimal-app-icons.html CSS栅格: <!DOCTYPE html> <html lang= ...

随机推荐

  1. vue-cli 3.0 图片路径问题（何时使用 public 文件夹）

    1. 图片放入public文件夹下时 参考:https://cli.vuejs.org/zh/guide/html-and-static-assets.html#public-%E6%96%87%E4 ...

  2. onSaveInstanceState和onRestoreInstanceState触发的时机

    先看Application Fundamentals上的一段话: Android calls onSaveInstanceState() before the activity becomes vul ...

  3. 【转载】SSD断电保护原理

    异常掉电的隐患 若没有合理的掉电保护机制,而异常掉电的发生又不可避免,当发生异常掉电,会引发很多问题. (1)丢盘 异常掉电,会使得映射表来不及保存,丢失逻辑地址到物理地址的映射,待重新上电后,SSD ...

  4. NAND Flash底层原理，SLC MLC TLC比较

    NAND-Flash 的存储原理 固态硬盘最小单元的基本架构如下: 我们知道计算机中所有的信息储存最终都必须回归到 0与1,原则上,只要存储单元能提供两种或两种以上可供辨识的状态,便可以拿来纪录数据. ...

  5. SonarQube 平台搭建代码审查平台步骤

    SonarQube 平台1.下载包,安装启动2.在sonar.properties 配置mysql数据库的sonar.jdbc.username=sonarsonar.jdbc.password=so ...

  6. git 跟踪提交记录

    一.克隆git仓库 git clone ssh://hwl@xxx/home/data/repositories/git.git 二.申明使用人信息,以便跟踪提交记录 $ git config --g ...

  7. pytorch 对变长序列的处理

    一开始写这篇随笔的时候还没有了解到 Dateloader有一个 collate_fn 的参数,通过定义一个collate_fn 函数,其实很多batch补齐到当前batch最长的操作可以放在colla ...

  8. HDU Ignatius's puzzle

    链接 [http://acm.hdu.edu.cn/showproblem.php?pid=1098] 分析: 数学归纳法 f(1) = 18 + ka; 假设f(x) = 5x^13+13x^5+k ...

  9. 第二个spring冲刺第3天

    今天天气突然变得很冷,所以我们队的人都有少许的不适.加上天气比较冷,我们都不怎么想做.幸好在队长的提醒下,我们终于继续投入研发的工作中.由于市面上的同类软件的数量不少所以我们下载了一些来看,希望能找到 ...

  10. 使用Visual Studio 2013进行单元测试的过程与感想

    首先是安装Visual Studio 2013这个软件,尽管安装过程不复杂,但是安装的时间实在是太长了,经过2个多小时的安装终于装完了. 由于时间紧凑,没来得及装语言包,于是,我用了原装的进行了单元测 ...