Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

How to set div width and height by css

2025-03-28 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/01 Report--

This article mainly introduces "how to set div width and height in css". In daily operation, I believe many people have doubts about how to set div width and height in css. The editor consulted all kinds of materials and sorted out simple and easy-to-use operation methods. I hope it will be helpful to answer the doubts about "how to set div width and height in css". Next, please follow the editor to study!

1. Width and height attributes

Width: width-- width:230px configuration width value is 230px

High: height-- height:90px sets the equipment css high value to 90px

2. Apply height and width directly in div tags

1. Css instance code

This div width 260px, high 100px this div width 160px, height 70px

The height and width of the equipment are set for the two div respectively. In order to see the effect of setting the height and width of the equipment, the css frame technique is set up at the same time.

2. Screenshot

Success directly sets width and height css to div

3. Div uses id or class to introduce internal CSS settings, equipment width and height style

1. Div css instance HTML instance code

Div width and height instance css5.com.cn#shili {width:180px; height:80px; border:2px solid # F00} .yangshi {width:90px; height:110px; border:2px solid # 00F}

This div width 180px, high 80px this div width 90px, height 110px

Use id and class to set css width and css height fancy for div

2. Efficacy

At this point, the study on "how to set the width and height of css div" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report