Formally return to CSS

Preface: Before the Web front-end project only sporadic contact with the knowledge of the front-end, no system to sort out the knowledge system, so in the entry (Web front-end) two months, found that CSS in the page layout plays a vital role, good build page layout, in the later writing JS also very helpful, Because of the expansion of the page (product requirements design requirements) So this is the reason for re-return!

Regression thinking:

CSS Essentials:

1. Align

2. Center, vertical, horizontal

3. Floating, closed floating

4. Details (reset this reset line to how to better use, and then better apply to their own projects)

1.CSS inherit inherit the parent container's attributes refer to size, color, background

In fact the size of the use is not very large, in the relative Hongyu color, the background may have its own advantages

where

When

Unlike height or width:100%,

Connection

Flexibility

2.text-align:justify

From Zhang Xin Xu's blog back, on this CSS implementation of the text alignment has a little enlightenment, justify the intention is to stretch the space between the left and right justify, set in the text can accomplish the goal.

See demo (temporarily put in Jsffidle): https://jsfiddle.net/deqntw16/

If it's for example a list item, or a restrained element, the last line is not aligned (one line is the first row)!

So what?

Analyze the principle of justify: text or list more than one line, there is space between elements, and then use our justify to do it.

So according to this principle, in the last addition, such as Inline-block (width 100%, height 0) can be achieved.

The structure is OK but sometimes the Open is very ugly!

So the goal is to make the last line align to the left

1. Inline-block that also fills the "one line" and then balances the list item of the entire row (that is, placing the same number of list items as the previous line) to create the illusion

2. You can make letter-spacing adjustments to the last line individually

=============================================================

Formally return to CSS