Home >Web Front-end >CSS Tutorial >How to create a new box with a solid border and a red box
The content of this article is about how to create a new box with a solid border and a red box. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you. .
Create a new red box with a solid border, a DIV CSS instance, and use the editor software to create a new red border object instance. [Recommended reading: How to add border style to css table? Summary of css table border styles (with complete examples )】
In order to observe the effect, set a css height and css width style for the box, and assign a red css border style. At the same time, for the sake of compatibility, DW software is still used to create this instance.
Instance description, we name this instance css ".php1" and use class reference in html. The css width is 380px, the css height is 200px, and there is a solid border with a border width of 2px.
Border basic syntax:
Border: border Enter the css border tutorial
The complete example HTML code is as follows:
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>新建边框实例</title> <style> .php1{ width:380px; height:200px; border:2px solid #F00} </style> </head> <body> <div class="php1">我宽度为380px 高度200px 边框2px红色</div> </body> </html>
The preview is as follows:
The above is the complete introduction on how to create a new box with a solid border and a red box. If you want to know more about CSS3 tutorial, please pay attention to the PHP Chinese website.
The above is the detailed content of How to create a new box with a solid border and a red box. For more information, please follow other related articles on the PHP Chinese website!