HTML border dashed-html dashed border setting

HTML border dashed-html dashed border setting

HTML border dashed line implementation of different objects via CSS dotted border style (body acoustic wave)

In HTML, you can add a border or a dashed border to most of the labels, and then DIVCSS5 a few different labels with a dashed border effect style, which you can flexibly master and apply to your own div+css layout according to the presentation extension.
First, CSS styles and HTML tag elements-TOP

In order to add a dotted line to the HTML different labels, we select several common label alignments to set the border dashed effect. (Body acoustic Wave)

1. Common HTML tags
div tags
Span
UL Li
Table TR TD

2, the instance uses the CSS attribute word (body acoustic wave)
Border
Width
Height

3, implementation of the dotted line CSS focus on the introduction
Border is the border property, if you want to implement an object border effect, set the border width, border color, border style (solid or dashed)
BORDER:1PX dashed #F00 This is to set the border style width to 1px, dashed, dashed red.

4. Example Description
We set the same width, same height, and border effect on several of these labels.

5. Full HTML code:

<! DOCTYPE html>


<meta charset= "Utf-8"/>
<title>html Border Dashed Demo www.divcss5.com</title>
<style>
. bor{border:1px dashed #F00; width:300px;height:60px;margin-top:10px}
SPAN{DISPLAY:BLOCK}/*CSS Note: Let span form a block */
</style>

<body>
<div class= "Bor" >div box </div>
<span class= "Bor" >span box </span>
<ul class= "Bor" >
<li>ul Li List </li>
<li>ul Li List </li>
</ul>
<table class= "Bor" >
<tr>
<td> Forms </td>
<td> form 2</td>
</tr>
<tr>
<td> Data </td>
<td> Data 2</td>
</tr>
</table>
</body>

The above example sets the same style for different tags in html, including dashed lines with the same border. (Body acoustic Wave)

6. Browser effect

HTML different labels set border dashed effect
HTML different labels set border dashed effect