CSS边框的属性

最新推荐文章于 2024-08-12 09:00:00 发布

小白学代码

最新推荐文章于 2024-08-12 09:00:00 发布

阅读量440

点赞数

分类专栏：静态HTML 初学者

本文链接：https://blog.csdn.net/xiahang1121/article/details/89842231

版权

初学者同时被 2 个专栏收录

33 篇文章 1 订阅

订阅专栏

静态HTML

17 篇文章 0 订阅

订阅专栏

Css中属性设置与HTML中的属性设置相同的样式略有不同注意区分

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>边框的设置</title>
		<style type="text/css">
			#mytale111{
				height: 586px;
				width: 880px;
		        /*分别设置线型,线度,线颜色,默认无边框 线型设置为none,必须设置线型才能看到效果*/
				border-top-style: dashed;
				border-bottom-style: dotted;
				border-right-style: solid;
				border-left-style: double;
				
				border-top-width: 5px;
				border-bottom-width:thin ;
				border-right-width: medium;
				border-left-width: thick;
				
				border-top-color: red;
				border-bottom-color:gold ;
				border-right-color: green;
				border-left-color: blueviolet;
				
				/*分别为各个边设置宽度,顺序为上右下左*/
				border-width: ;
				/*分别为各个边设置线型,顺序为上右下左*/
				border-style: ;
				/*分别为各个边设置颜色,顺序为上右下左*/
				border-color: ;
				
				/*分别,按宽度,线型,颜色 顺序设置边框属性,中间用空格隔开*/
				border-top
				border-right
				border-bottom
				border-left
				
				
				/*声明四个边框共有的属性,按宽度,线型,颜色 顺序设置边框属性,中间用空格隔开*/
				border:;
				/*将相邻的两条边合并成一条边*/
				border-collapse: collapse; 
			}
			
			/*内边框的设置*/
			#mytale111 td{
				border: 1px solid green;
			}
		</style>
	</head>
	<body>
		<table id="mytale111" >
			<tr>
				<td>单元格</td>
				<td>单元格</td>
			</tr>
			<tr>
				<td>单元格</td>
				<td>单元格</td>
			</tr>
		</table>
	</body>
</html>