<!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. angularJs 技巧总结及最佳实践

    强烈建议通读官方wiki文档,里面包含了FAQ,最佳实践,深入理解最核心的Directive及Scope等文章, 基础 1. 使用ng-repeat指令,为防止重复值发生的错误.加上track by ...

  2. Django中的cookie和session

    前言 HTTP协议 是短连接.且状态的,所以在客户端向服务端发起请求后,服务端在响应头 加入cokie响应给浏览器,以此记录客户端状态: cook是来自服务端,保存在浏览器的键值对,主要应用于用户登录 ...

  3. 行级安全（Row-Level Security）

    通过授予和拒绝(Grant/Deny)命令控制用户的权限,只能控制用户对数据库对象的访问权限,这意味着,用户访问的粒度是对象整体,可以是一个数据表,或视图等,用户要么能够访问数据库对象,要么没有权限访 ...

  4. 微信小程序获取客户端系统信息

    微信小程序中有个API: wx.getSystemInfo() 可以获取系统的信息 wx.getSystemInfoSync()===>同步获取系统信息 wx.getSyatemInfo({ s ...

  5. Mvc4_语法基础介绍

    @model MvcApplicationTest.Models.User @{ ViewBag.Title = "Index"; } <script type=" ...

  6. Js_checkbox的互斥

    function ck_click(obj) { var ck_20 = document.getElementById("ck_20"); var ck_25 = documen ...

  7. Jmeter目录文件讲解

    1.bin:核心可执行文件,包含配置 2.windows启动文件:jmeter.bat mac或linux启动文件:jmeter jmeter-server:mac或linux分布式压测启动文件 jm ...

  8. Kubernetes并发控制与数据一致性的实现原理

    在大型分布式系统中,定会存在大量并发写入的场景.在这种场景下如何进行更好的并发控制,即在多个任务同时存取数据时保证数据的一致性,成为分布式系统必须解决的问题.悲观并发控制和乐观并发控制是并发控制中采用 ...

  9. 比特币初始版本VC6.0编译

    1 源码下载 github上初始版本是bitcoin-0.1.5,可以从https://github.com/bitcoin/bitcoin下载,但是从网上可以找到更老版本bitcoin-0.1.0, ...

  10. M1事后分析报告

    在得到M1团队成绩之后,每个团队都需要编写一个事后分析报告,对于团队在M1阶段的工作做一个总结. 请在2015年11月24日上课之前根据下述博客中的模板总结前一阶段的工作,发表在团队博客上,并在课上的 ...