If HTML is compared to the skeleton of a web page, then CSS is the skin of the web page, which makes our web page look better
Before talking about CSS, let’s talk about id and class: id is a concept similar to a variable, it is unique, and class is a variable group, you can specify multiple, usually defined in HTML, use CSS selector to find them, and then modify their property values.
E.g:
<div id="post"></div>
<div class="post-content"></div>
<div class="post-content"></div>/*This class consists of two parts*/
Let's talk about CSS selectors, the search method of id is #id name, the search method of class is .class name, and the basic HTML tags are directly represented by tag names:
For example: #post and .post-content and a
CSS selectors use a hierarchical structure, hierarchical search
For example #post .post-conten is the post-content in the post content
The structure of CSS is also very simple:
Selector{
property: property value;/*Remark*/
}
It is such a simple structure, but it can make our web pages look all kinds of.
Then we use the developer tool (press F12 to pop up) to talk about the structure of each web page and the content in each web page
margin (outer complement), border (border), padding (inner complement), height (height), width (width)
This structure is like our express, the outer patch is like a layer of wrapping paper outside the box, the border is our box, the inner patch is the stuffing used to protect the inner patch, and the length and width constitute our What you actually bought. (very aptly described)
Through these properties we can adjust the position, size, etc. properties of our content
Note that when two things are put together, their outer complements will overlap
Finally, let's talk about a few commonly used pseudo-classes:
:active when the current mouse clicks on the link
:hover when the mouse hovers over the element
:link when the link has not been visited yet
:visited 当链接被访问过之后
把他们加在选择器后面就是想要的结果了
例如:一个按钮可以通过伪类使我们的鼠标放在上面时有相应的变化
#button:hover{
background:blue;
}
CSS先说这么多了,想到再来补充,总之这个需要多加练习,多打代码,只是看教程而不去实验是怎么也学不会的