How to set div size with css

醉折花枝作酒筹
Release: 2023-01-05 16:10:09
Original
5150 people have browsed it

In CSS, you can use the width attribute and height attribute to set the div size. You only need to set the "width: value" and "height: value" styles for the div element. The width attribute defines the width of the element's content area, and the height attribute defines the height of the element's content area.

How to set div size with css

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

Create a new html file and name it test.html. In the test.html file, use the div tag to create a module and add text content in the div.

In the test.html file, Set the class attribute of the div tag to erliu, which is mainly used to set the css style of the div through this css.

In the test.html file, write the tag, and the css style of the page will be written in this tag.

In the css tag, write the style of the div and use the background attribute to set the background color of the div to red.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>document</title> 
<style>
.erliu{
    background: red;
}
</style>
</head>
<body>
    <div class="erliu">
        测试
    </div>
</body>
</html>
Copy after login

View:

How to set div size with css

##In the css tag, write the style of the div, use the width attribute to set the width of the div to 200px, and use the height attribute to set the div's width The height is 100px.

.erliu{
    /* width: 200px;
    height: 100px; */
    background: red;
}
Copy after login
View the effect:


How to set div size with css

Recommended learning:

css video tutorial

The above is the detailed content of How to set div size with css. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!