Home  >  Article  >  Web Front-end  >  How to remove the top border in css

How to remove the top border in css

青灯夜游
青灯夜游Original
2021-11-09 16:32:124749browse

How to remove the top border in css: 1. Use the "border-top:none;" statement to remove it; 2. Use the "border-top:transparent;" statement to set the border color of the top border to transparent; 3. , use the "border-top:0;" statement to set the border width of the top border to 0.

How to remove the top border in css

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

When we use the border attribute to set the border, we will set all four borders at once:

<!DOCTYPE html>
<html>
	<head>
		<style>
			div{
				height: 50px;
				border: 1px solid red;
			}
		</style>
	</head>
	<body>
		<div></div>
	</body>
</html>

How to remove the top border in css

Sometimes, we don’t need The upper border, then how to remove it? You can use the border-top attribute.

Method 1:

div{
	height: 50px;
	border: 1px solid red;
	border-top:none;
}

How to remove the top border in css

##Method 2:

div{
	height: 50px;
	border: 1px solid red;
	border-top:transparent;
}

How to remove the top border in css

Method 3:

div{
	height: 50px;
	border: 1px solid red;
	border-top:0;
}

How to remove the top border in css

(Learning video sharing:

css video tutorial)

The above is the detailed content of How to remove the top border in css. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn