首页前端开发JavaScripthtml怎么将表格边框隐藏

html怎么将表格边框隐藏

时间2024-01-29 20:15:02发布访客分类JavaScript浏览181
导读:收集整理的这篇文章主要介绍了html怎么将表格边框隐藏,觉得挺不错的,现在分享给大家,也给大家做个参考。htML将表格边框隐藏的方法:1、使用style属性给table、th、td元素添加“border: none;”样式;2、使用styl...
收集整理的这篇文章主要介绍了html怎么将表格边框隐藏,觉得挺不错的,现在分享给大家,也给大家做个参考。

htML将表格边框隐藏的方法:1、使用style属性给table、th、td元素添加“border: none; ”样式;2、使用style属性给table元素添加“border-color: transparent; ”样式。

本教程操作环境:windows7系统、CSS3& & HTML5版、Dell G3电脑。

我们有下面一个表格:

table border="1">
    	tr>
    		th>
    姓名/th>
    		th>
    年龄/th>
    	/tr>
    	tr>
    		td>
    PEter/td>
    		td>
    20/td>
    	/tr>
    	tr>
    		td>
    Lois/td>
    		td>
    20/td>
    	/tr>
    /table>
    

怎么将这个表格的边框隐藏起来?下面介绍一下方法:

1、给table、th、td元素添加border: none; 样式

!DOCTYPE html>
    html>
    	head>
    		meta charset="utf-8">
    	/head>
    	body>
    table border="1" style="border: none;
    ">
    	tr>
    		th  style="border: none;
    ">
    姓名/th>
    		th  style="border: none;
    ">
    年龄/th>
    	/tr>
    	tr>
    		td style="border: none;
    ">
    Peter/td>
    		td style="border: none;
    ">
    20/td>
    	/tr>
    	tr>
    		td style="border: none;
    ">
    Lois/td>
    		td style="border: none;
    ">
    20/td>
    	/tr>
    /table>
    	/body>
    /html>
    

2、给table元素添加border-color: transparent; 样式

table border="1" style="border-color: transparent;
    ">
    	tr>
    		th>
    姓名/th>
    		th>
    年龄/th>
    	/tr>
    	tr>
    		td>
    Peter/td>
    		td>
    20/td>
    	/tr>
    	tr>
    		td>
    Lois/td>
    		td>
    20/td>
    	/tr>
    /table>
    

推荐教程:《html视频教程》

以上就是html怎么将表格边框隐藏的详细内容,更多请关注其它相关文章!

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

html表格边框

若转载请注明出处: html怎么将表格边框隐藏
本文地址: https://pptw.com/jishu/591547.html
HTML用什么标签包含文档标题 html页面的布局技术有哪些

游客 回复需填写必要信息