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中的注音对齐属性ruby-align用法指南
Jul 01 HTML / CSS
纯css3实现的鼠标悬停动画按钮
Dec 23 HTML / CSS
如何使用css3实现一个类在线直播的队列动画的示例代码
Jun 17 HTML / CSS
CSS3 实现穿梭星空动画
Nov 13 HTML / CSS
HTML5 Canvas概述
Aug 26 HTML / CSS
html5拖曳操作 HTML5实现网页元素的拖放操作
Jan 02 HTML / CSS
html5 canvas-1.canvas介绍(hello canvas)
Jan 07 HTML / CSS
html5记忆翻牌游戏实现思路及代码
Jul 25 HTML / CSS
html5 canvas实现圆形时钟代码分享
Dec 25 HTML / CSS
html5 canvas简单封装一个echarts实现不了的饼图
Jun 12 HTML / CSS
基于Html5 canvas实现裁剪图片和马赛克功能及又拍云上传图片 功能
Jul 09 HTML / CSS
浅谈由position属性引申的css进阶讨论
May 25 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 数组二分法查找函数代码
2010/02/16 PHP
php安全配置 如何配置使其更安全
2011/12/16 PHP
Zend的MVC机制使用分析(二)
2013/05/02 PHP
PHP微信API接口类
2016/08/22 PHP
php实现socket推送技术的示例
2017/12/20 PHP
Jquery replace 字符替换实现代码
2010/12/02 Javascript
Extjs4.0设置Ext.data.Store传参的请求方式(默认为GET)
2013/04/02 Javascript
中文字符串截取的js函数代码
2013/04/17 Javascript
javascript与有限状态机详解
2014/05/08 Javascript
Nodejs中session的简单使用及通过session实现身份验证的方法
2016/02/04 NodeJs
jQuery向父辈遍历的简单方法
2016/09/18 Javascript
javascript 正则表达式分组、断言详解
2017/04/20 Javascript
JavaScrpt的面向对象全面解析
2017/05/09 Javascript
基于Bootstrap分页的实例讲解(必看篇)
2017/07/04 Javascript
微信{"errcode":48001,"errmsg":"api unauthorized, hints: [ req_id: 1QoCla0699ns81 ]"}
2018/10/12 Javascript
vue router的基本使用和配置教程
2018/11/05 Javascript
让python同时兼容python2和python3的8个技巧分享
2014/07/11 Python
Python金融数据可视化汇总
2017/11/17 Python
通过python+selenium3实现浏览器刷简书文章阅读量
2017/12/26 Python
pygame实现俄罗斯方块游戏
2018/06/26 Python
对Python 两大环境管理神器 pyenv 和 virtualenv详解
2018/12/31 Python
python实现大转盘抽奖效果
2019/01/22 Python
Python中print和return的作用及区别解析
2019/05/05 Python
django使用graphql的实例
2020/09/02 Python
用Python 执行cmd命令
2020/12/18 Python
Python LMDB库的使用示例
2021/02/14 Python
css3 border-image使用说明
2010/06/23 HTML / CSS
移动Web—CSS为Retina屏幕替换更高质量的图片
2012/12/24 HTML / CSS
葡萄牙航空官方网站:TAP Air Portugal
2019/10/31 全球购物
音乐学个人的自荐书范文
2013/11/26 职场文书
普通院校学生的自荐信
2013/11/27 职场文书
师生聚会感言
2014/01/26 职场文书
集体备课反思
2014/02/12 职场文书
让世界充满爱演讲稿
2014/05/24 职场文书
自愿离婚协议书范本
2015/01/26 职场文书
教你如何让spark sql写mysql的时候支持update操作
2022/02/15 MySQL