Home  >  Article  >  Web Front-end  >  How to set dotted dividing line in css

How to set dotted dividing line in css

WBOY
WBOYOriginal
2021-12-02 17:40:4512169browse

How to set the dotted dividing line in css: 1. Use the "element {height:0;}" statement to set the height of the element to 0; 2. Add the border attribute to the element with a height of 0, and set the height of the element to 0. Just set the border style to dotted line, and the syntax is "border: thickness value dashed color value;".

How to set dotted dividing line in css

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

How to set the dotted dividing line in css

Set the height value of an empty div element to 0, and the width value is the length value of the dotted line. Then through the border attribute, define the border as a dotted line to get a dotted dividing line.

The example is as follows:

<html>
<head>
<style type="text/css">
div{
    border:1px dashed red;
  height:0;
  width: 200px;
}
</style>
</head>
<body>
<div></div>
</body>
</html>

Output result:

How to set dotted dividing line in css

(Learning video sharing: css video tutorial)

The above is the detailed content of How to set dotted dividing line 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