How to set the border effect for a picture with the border property of CSS

How to set a border for the picture through CSS, the HTML is through the tag of the border property value, the picture is added to the border, CSS is through the border property, for the picture to set a variety of border styles, Border-style define the style of the border , such as dashed lines, solid lines or dashes, and so on.

HTML to set the border of a picture

The border property value of the tag is added to the HTML to control the thickness of the border, and when the value is 0 o'clock, there is no border.

<span style= "FONT-SIZE:24PX;" ></span>

The code above, you can see all the borders are black, and the style is very single, are solid lines, just the thickness of the border can be adjusted.

CSS sets the border of a picture

The syntax hints in Dreamweaver make it easy to get values for various border styles.

You can define the color of the border by Border-color, border-width define the thickness of the border.

On top of the code, the first picture has a golden color, a 5-pixel-wide dash, and the second picture is a blue, 2-pixel-wide dashed line.

In CSS, you can set different styles of 4 borders, respectively, to Border-left, Border-right, Border-top, Border-bottom.


On top of the code, there are different styles for the four borders of the picture, which are often used in many other HTML elements.

The Border property also allows you to write individual values into the same statement, separated by spaces, which can greatly reduce the length of the code.


This way, you can speed up the download of your Web pages and make them easier to read.

In addition, in addition to the border property can write individual property values together, many other CSS properties can do similar operations, such as Font,margin and padding properties can be unified.

<span style= "FONT-SIZE:24PX;" >p{font:italic Bold 30px arial,helvetica,sans-serif;padding:0px 5px 0px 3px;} </span>
Related recommendations:

Two ways to implement the CSS dash style: dotted and dashed (instance)