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

This article mainly shows you "how to set the level of css center", the content is easy to understand, clear, hope to help you solve your doubts, the following let the editor lead you to study and learn "how to set the level of css center" this article.

First: horizontal center of elements in the css line:

Syntax: all inline elements in div {text-align:center} / * DIV are centered horizontally * /

Simple explanation: set the text-align:center style in the parent element.

Horizontal center of elements in the line

Detailed explanation:

1, the text here so that the word "text" relative to the level of label is meaningless, label is an inline element, its width is equal to the width of the content, that is to say, the word "text" is always horizontal.

2 、

Words

At this point, it makes sense to center the two words "text" horizontally, because p is a block-level element, and its width occupies only one line, while the text occupies only two characters in width, so the two words "text" are centered horizontally within a line by setting text-align:center; for the p element.

3. Text, how to center the label element relative to the div level at this time.

After reading the horizontal center of elements in the css line, we next say that the horizontal center of css block-level elements, and the horizontal center of css block-level elements are divided into fixed-width block-level elements and variable-width block-level elements. Let's take a look at them respectively.

Second: css fixed-width block-level elements are horizontally centered: both block-level elements and fixed-width elements.

Set the left and right margin values of the block-level elements that need to be centered horizontally to auto

For example:

Css variable width block-level elements are horizontally centered: block-level elements with variable width

For example:

1. Add block-level elements to the tag.

Set table to achieve horizontal center

2. Set the block level element style display:inline, and then add the text-align:center style to the parent element.

Set inline to achieve horizontal center

3. Add a parent element to the block-level element, and set the parent element style to style= "float:left;position:relative;left:50%"; set the block-level element style to style= "float:left;position:relative;left:-50%"

Set relative to achieve horizontal center

The above is all the content of the article "how to set the level center of css". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

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.