html+css合并表格边框的示例代码


Posted in HTML / CSS onMarch 31, 2021

我们给table和td标签加边框时,默认使用双边框,像这样。

html+css合并表格边框的示例代码
 

如果我们希望合并table与td的边框,可以在table样式加设置border-collapse的属性值为collapse即可。如下图:
 

html+css合并表格边框的示例代码
 

再看效果:
 

html+css合并表格边框的示例代码
 

为了便于复制,这里给出代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        table{
            border: 1px solid blue;/*表添加边框*/
            border-collapse: collapse;/*合并边框*/
        }
        td{
            border: 1px solid blue;/*单元格添加边框*/
        }
    </style>
</head>
<body>
    <table>
        <tr>
            <td>1.1</td>
            <td>1.2</td>
        </tr>
        <tr>
            <td>2.1</td>
            <td>2.2</td>
        </tr>
    </table>
</body>
</html>

到此这篇关于html+css合并表格边框的示例代码的文章就介绍到这了,更多相关html合并表格边框内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章,希望大家以后多多支持三水点靠木!

 
HTML / CSS 相关文章推荐
CSS3使用多列制作瀑布流
May 10 HTML / CSS
网页布局中CSS样式无效的十个重要原因详解
Aug 10 HTML / CSS
css3实例教程 一款纯css3实现的环形导航菜单
Oct 20 HTML / CSS
CSS3制作缩略图的详细过程
Jul 08 HTML / CSS
传统HTML页面实现模块化加载的方法
Oct 15 HTML / CSS
Bootstrap 学习分享
Nov 12 HTML / CSS
html5 web本地存储将取代我们的cookie
Dec 26 HTML / CSS
HTML5之WebGL 3D概述(上)—WebGL原生开发开启网页3D渲染新时代
Jan 31 HTML / CSS
简单介绍HTML5中audio标签的使用
Sep 24 HTML / CSS
Canvas globalCompositeOperation
Dec 18 HTML / CSS
详解CSS故障艺术
May 25 HTML / CSS
前端使用svg图片改色实现示例
Jul 23 HTML / CSS
使用HTML+Css+transform实现3D导航栏的示例代码
z-index不起作用
Mar 31 #HTML / CSS
元素水平垂直居中的方式
Mar 31 #HTML / CSS
简单介绍 http请求响应参数、无连接无状态、MIME、状态码、端口、telnet、curl
简单实现一个手持弹幕功能+文字抖动特效
HTML基础-标签分类(闭合标签,空标签,块级元素,行内元素,行级块元素,可替换元素)
Mar 31 #HTML / CSS
Web前端:CSS最强总结 附详细代码
You might like
php实现memcache缓存示例讲解
2013/12/04 PHP
推荐5款跨平台的PHP编辑器
2014/12/25 PHP
一种JavaScript的设计模式
2006/11/22 Javascript
JS 文字符串转换unicode编码函数
2009/05/30 Javascript
JQuery EasyUI 对话框的使用方法
2010/10/24 Javascript
JQuery设置时间段下拉选择实例
2014/12/30 Javascript
常用jQuery代码分享
2015/07/14 Javascript
JavaScript编写简单的计算器
2015/11/25 Javascript
jQuery手指滑动轮播效果
2016/12/22 Javascript
js实现省份下拉菜单效果
2017/02/15 Javascript
浅谈vue中数据双向绑定的实现原理
2017/09/14 Javascript
vue项目实战总结篇
2018/02/11 Javascript
vscode下vue项目中eslint的使用方法
2019/01/13 Javascript
js回文数的4种判断方法示例
2019/06/04 Javascript
浅谈bootstrap layer.open中end的使用方法
2019/09/12 Javascript
详解Vue.js 作用域、slot用法(单个slot、具名slot)
2019/10/15 Javascript
javascript前端和后台进行数据交互方法示例
2020/08/07 Javascript
[01:08:48]LGD vs OG 2018国际邀请赛淘汰赛BO3 第三场 8.25
2018/08/29 DOTA
Python遍历目录并批量更换文件名和目录名的方法
2016/09/19 Python
python实现对csv文件的列的内容读取
2018/07/04 Python
python十进制和二进制的转换方法(含浮点数)
2018/07/07 Python
Python图像处理之直线和曲线的拟合与绘制【curve_fit()应用】
2018/12/26 Python
学习python的前途 python挣钱
2019/02/27 Python
Python3中函数参数传递方式实例详解
2019/05/05 Python
Django Xadmin多对多字段过滤实例
2020/04/07 Python
PyQT5 实现快捷键复制表格数据的方法示例
2020/06/19 Python
Wiggle中国:英国骑行、跑步、游泳 & 铁三运动装备专卖网店
2016/08/02 全球购物
全球性的在线购物网站:Zapals
2017/03/22 全球购物
Clearly新西兰:购买眼镜、太阳镜和隐形眼镜
2018/04/26 全球购物
Nike瑞典官方网站:Nike.com (SE)
2018/11/26 全球购物
英国森林假期:Forest Holidays
2021/01/01 全球购物
内勤岗位职责范本
2015/04/13 职场文书
2015年新农村建设工作总结
2015/05/22 职场文书
SpringBoot实现quartz定时任务可视化管理功能
2021/08/30 Java/Android
Python数据结构之队列详解
2022/03/21 Python
Spring Boot实现文件上传下载
2022/08/14 Java/Android