(转)HTML表格边框的设置小技巧
对于很多初学HTML的人来说,表格<table>是最常用的标签了,但对于表格边框的控制,很多初学者却不甚其解。
一般我们用表格的时候总会给它个border属性,比如:<table border="1">,其效果如下:
ID | NAME | GENDER |
1001 | mike | male |
可以发现表格的边框好像很宽,当然这里的“很宽”绝对不是表格border的宽,大家看到的宽应该是<td>之间有间隙所致。因此只需要修改表格的cellspacing属性即可,即:<table border="1px" cellspacing="0px">,效果如下:
ID | NAME | GENDER |
1001 | mike | male |
但是,好像宽度还是没有我们想象的那样:只有一个像素的宽,其实,上图大家看到的其实是两个像素的宽,为什么呢,这是因为<td>之间的边框没有重合所致。修改表格的border-collapse属性即可,
即<table border="1px" cellspacing="0px" style="border-collapse:collapse">
ID | NAME | GENDER |
1001 | mike | male |
再给表格加个颜色,<table border="1px" bordercolor="#000000" cellspacing="0px" style="border-collapse:collapse">
ID | NAME | GENDER |
1001 | mike | male |
(转)HTML表格边框的设置小技巧的更多相关文章
- HTML表格边框的设置小技巧
对于很多初学HTML的人来说,表格<table>是最常用的标签了,但对于表格边框的控制,很多初学者却不甚其解. 对于很多初学HTML的人来说,表格<table>是最常用的标签了 ...
- HTML表格边框的设置小技巧-表格
对于很多初学HTML的人来说,表格<table>是最常用的标签了,但对于表格边框的控制,很多初学者却不甚其解. 一般我们用表格的时候总会给它个border属性,比如:<table b ...
- css学习の第六弹—样式设置小技巧
一.css样式设置小技巧>>1.行内元素水平居中是通过给父元素设置 text-align:center 来实现的.html代码:<body> <div class=&qu ...
- Xshell远程连接的具体操作和Xshell多会话设置小技巧
前几天给大家分享了Xshell的安装教程,今天给大家分享如何在Xshell中进行远程连接,并且分享一下如何设置一条命令可以发送多个终端,这里以Xshell6为例进行说明,具体的教程如下. 1.依次点击 ...
- html 表格边框的设置
对于很多初学HTML的人来说,表格<table>是最常用的标签了,但对于表格边框的控制,很多初学者却不甚其解. 一般我们用表格的时候总会给它个border属性,比如:<table b ...
- 从零开始学习html(十五)css样式设置小技巧——下
六.垂直居中-父元素高度确定的单行文本 <!DOCTYPE HTML> <html> <head> <meta charset="utf-8&quo ...
- 超 Nice 的表格响应式布局小技巧
今天,遇到了一个很有意思的问题,一名群友问我,仅仅使用 CSS,能否实现这样一种响应式的布局效果: 简单解析一下效果: 在屏幕视口较为宽时,表现为一个整体 Table 的样式 而当屏幕视口宽度较小时, ...
- CSS设置小技巧
水平居中 对于元素的水平居中,有三种情况: 行内元素(文字.图片等):text-align: center; 定宽块状元素(有设置宽度的block元素):margin: 0 auto; 不定宽块状元素 ...
- CSS样式设置小技巧
1.水平居中设置 行内元素居中设置:如果被设置元素为文本.图片等行内元素时,水平居中是通过给父元素设置 text-align:center 来实现的.代码示例如下: HTML代码 <body&g ...
随机推荐
- 保留你的dSYM文件
大家编译iPhone程序的时候,都会发现二进制文件的旁边生成了一个.dSYM文件.以前一直不知道这个文件是用来干嘛的,今天才知道这个是symbol file,用来debug用的. 大家可以读读这篇文档 ...
- German Collegiate Programming Contest 2013:E
数值计算: 这种积分的计算方法很好,学习一下! 代码: #include <iostream> #include <cmath> using namespace std; ; ...
- Web-Scale-IT 到底是啥?
Gartner 对 2015 年 10 大 IT 趋势的预测中有一个词条为:Web Scale IT.我们跟随 Matthias Ankli 来了解一下究竟什么是 Web Scale IT.本文译自 ...
- The Perfect Stall
poj1274:http://poj.org/problem?id=1274 题意:有n个奶牛和m个谷仓,现在每个奶牛有自己喜欢去的谷仓,并且它们只会去自己喜欢的谷仓吃东西,问最多有多少奶牛能够吃到东 ...
- sort merge join,hash join,netsloop join
Join Operations ? SORT-MERGE JOIN – Sorts tables on the join key and then merges them together – Sor ...
- 【HDOJ】1728 逃离迷宫
题目大坑,注意行列顺序式反的,另外注意起点和终点相同. #include <iostream> #include <cstdio> #include <cstring&g ...
- TCP/IP 邮件的原理
邮件通过SMTP协议来实现,有它的服务器SMTP服务器. 它是怎么在万维网中运行的呢? 我们来看看两个案例,下面的两个图来展示. 案例一: Alice通过传统的邮件服务器发送给Bob,Bob通过HTT ...
- HashMap循环遍历方式及其性能对比
主要介绍HashMap的四种循环遍历方式,各种方式的性能测试对比,根据HashMap的源码实现分析性能结果,总结结论. 1. Map的四种遍历方式 下面只是简单介绍各种遍历示例(以HashMap为 ...
- Android问题:设置了requestWindowfeature(window.feature_no_title)后,为什么还要getwindow.setFlags?
//设置窗体全屏getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams. ...
- Unity Flow distort of screen
Shader "ScreenWater" {Properties { _MainTex ("Base (RGB)", 2D) = "white&quo ...