HTML - border 属性_HTML 菜鸟教程

HTML border 属性用于指定表格元素周围边框的宽度，但已弃用，转而使用 CSS 进行样式设置。

使用此功能可以改进网页的样式和结构，这对于修改元素的视觉外观特别有帮助。

语法


<tag border = "value"></tag>

适用于

下面列出的元素允许使用 HTML bgcolor 属性。

元素	描述
<img>	HTML <img> 标签用于在文档中附加图像
<table>	HTML<table>标签允许我们通过提供行和列功能以有组织的方式排列数据。
<object>	HTML <object>用于在网页上展示多媒体，包括音频、视频、图片、PDF和Flash。

HTML border 属性的示例

以下代码演示了 border 属性的用法

table 元素的边框

在下面的程序中，我们在 <table> 标签中使用 HTML 'border' 属性来设置整个表的边框。


<!DOCTYPE html>
<html lang="en">

<head>
	 <title>HTML border attribute</title>
</head>

<body>
	 <!-- Example of the HTML 'border' attribute -->
	 <h3>HTML 'border' attribute with table</h3>
	 <p>User details</p>
	 <table border='1'>
			<tr>
				 <th>S.No</th>
				 <th>Name</th>
				 <th>Age</th>
			</tr>
			<tr>
				 <td>1.</td>
				 <td>Revathi</td>
				 <td>22</td>
			</tr>
			<tr>
				 <td>2.</td>
				 <td>Sarika</td>
				 <td>22</td>
			</tr>
	 </table>
</body>

</html>

img 元素的边框

考虑到另一种情况，我们将使用带有 img 标签的 border 属性。


<!DOCTYPE html>
<html lang="en">

<head>
	 <title>HTML border attribute</title>
	 <style>
			img {
				 width: 300px;
			}
	 </style>
</head>

<body>
	 <!-- Example of the HTML 'border' attribute -->
	 <h3>Example of the HTML 'border' attribute with img</h3>
	 <img src=
"https://www.qikepu.com/html/images/html-mini-logo.jpg" border='5'>
</body>

</html>

对象元素的边框

在这个程序中，我们使用 'object' 元素定义外部源的容器。然后，我们在 <object> 标签中使用 'border' 元素来设置 'object' 元素的边框。


<!DOCTYPE html>
<html lang="en">

<head>
	 <title>HTML border attribute</title>
	 <style>
			object {
				 width: 200px;
				 height: 100px;
			}
	 </style>
</head>

<body>
	 <!-- Example of the HTML 'border' attribute -->
	 <h3>Example of the HTML 'border' attribute with object</h3>
	 <object data=
"https://www.qikepu.com/static/images/simply-easy-learning.png"
		border='4'>
			QikepuCom
	 </object>
</body>

</html>

支持的浏览器

浏览器
是否支持	Yes	Yes	Yes	Yes	Yes

<< HTML - bgcolor 属性 HTML - charset 属性 >>