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

This article mainly introduces the relevant knowledge of "what are the points for attention of non-replacement elements in the HTML line". The editor shows you the operation process through an actual case. The method of operation is simple and fast, and it is practical. I hope that this article "what are the points for attention of non-replacement elements in the HTML line" can help you solve the problem.

Attention points for inline non-replacement elements (padding, margin, and border)

1. The following attributes do not take effect on inline non-replacement elements

Width and height

Margin-top and margin-bottom (left and right margin can take effect normally)

two。 The following attributes have a special effect on non-replacement elements in the line

Padding-top and padding-bottom (left and right padding can take effect normally)

Sample code:

Span {

Padding-top: 8px

Padding-bottom: 8px

Background-color: red

}

Go to div

Span1

Span2

Lower div

Run result: the upper and lower padding set by span does not occupy space, so it will be extended to the upper and lower elements

Upper and lower border (left and right border can take effect normally)

Sample code:

Span {

Border-top: 8px solid green

Border-bottom: 8px solid green

Background-color: red

}

Go to div

Span1

Span2

Lower div

Run result: the upper and lower border set by span does not occupy space, so it will be extended to the upper and lower elements

This is the end of the introduction to "what are the points for attention to non-replacement elements in the HTML line". Thank you for reading. If you want to know more about the industry, you can follow the industry information channel. The editor will update different knowledge points for you every day.

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.