Home >Web Front-end >CSS Tutorial >Use DIV and CSS to create a red box with a solid border
Use DIV and CSS to create a red box with a solid border
- php中世界最好的语言Original
- 2017-11-28 12:02:025635browse
Let’s make a case for your reference. We use DW software to make a box with a red solid border. We name this box DIV. Here is the code example.
Set the box in order to observe the effect. A css height, css width style, and a red css border style. At the same time, DIV still uses DW software to create this instance for compatibility.
Name this instance css ".div" and use class to reference in the 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>
.div{ width:380px; height:200px; border:2px solid #F00}
</style>
</head>
<body>
<div class="div">我宽度为380px 高度200px 边框2px红色</div>
</body>
</html>I believe you have mastered it after reading these cases For more exciting methods, please pay attention to other related articles on the php Chinese website!
Related reading:
How to make DIV adaptive height
How to use CSS hides the text content of the image background
The necessity of initializing CSS before starting the front-end project
The above is the detailed content of Use DIV and CSS to create a red box with a solid border. For more information, please follow other related articles on the PHP Chinese website!