<!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. [LOJ#6044]. 「雅礼集训 2017 Day8」共[二分图、prufer序列]

    题意 题目链接 分析 钦定 \(k\) 个点作为深度为奇数的点,有 \(\binom{n-1}{k-1}\) 种方案. 将树黑白染色,这张完全二分图的生成树的个数就是我们钦定 \(k\) 个点之后合法 ...

  2. stl源码剖析 详细学习笔记deque（1）

    //--------------------------15/3/12---------------------------- deque { deque没有容量(capacity)观念,是动态分段的 ...

  3. FastDFS教程Ⅰ-文件服务器安装与Nginx配置

    1.简介     FastDFS是一个开源的轻量级分布式文件系统,它对文件进行管理,功能包括:文件存储.文件同步.文件访问(文件上传.文件下载)等,解决了大容量存储和负载均衡的问题.特别适合以文件为载 ...

  4. 利用KMP算法解决串的模式匹配问题（c++) -- 数据结构

    题目: 7-1 串的模式匹配 (30 分) 给定一个主串S(长度<=10^6)和一个模式T(长度<=10^5),要求在主串S中找出与模式T相匹配的子串,返回相匹配的子串中的第一个字符在主串 ...

  5. OpenState: Programming Platform-independent Stateful OpenFlow Applications Inside the Switch

    文章名称:OpenState: Programming Platform-independent Stateful OpenFlow Applications Inside the Switch Op ...

  6. 剑指offer：从上往下打印二叉树

    题目描述: 从上往下打印出二叉树的每个节点,同层节点从左至右打印. 解题思路: 实际就是二叉树的中序遍历问题.之前在leetcode刷过类似题目. 利用队列完成即可. 代码: /* struct Tr ...

  7. PHP 爬虫——QueryList

    前言: 来了个任务说要做个电影网站,要写个壳,数据直接从别人那扒.行吧!那就要学习下PHP爬虫了.占个博客,以后补充.http://study.querylist.cc/archives/6/ 之前开 ...

  8. PAT 甲级 1022 Digital Library

    https://pintia.cn/problem-sets/994805342720868352/problems/994805480801550336 A Digital Library cont ...

  9. Oracle client 使用 .net程序连接 数据库时 出现 8.1.7 的解决办法

    1. GS产品 连接oracle数据库时出现错误图示 2. 其实解决这个问题的办法很简单 一般是 修改一下 Oracle的app 目录的权限 最简单的办法是增加 everyone 权限 然后重启机器即 ...

  10. C语言变长数组data[0]

    1.前言 在刷题时遇到一个结构中包含char data[0],第一次见到时感觉很奇怪,数组的长度怎么可以为零呢?于是上网搜索一下这样的用法的目的,发现在linux内核中,结构体中经常用到data[0] ...