HTML+CSS Easy t...LOGIN

HTML+CSS Easy to get started with understanding CSS styles

1: What is CSS

css is the abbreviation of Cascading style Sheets. The Chinese translation is "Cascading Style Sheets". We are used to calling it "Cascading Style Sheets"

We should use css What to pay attention to:

1. When there are multiple web pages to use CSS, use the method of externally connecting CSS files, so that the code of the web page is greatly reduced and it is very convenient to modify; it is only used in a single web page. CSS uses the document header method; CSS, which is only used in one or two places on a web page, uses inline insertion.

2. The three usages can be mixed without causing confusion. This is why it is called "Cascading Style Sheet". The browser handles it like this when displaying a web page: first check whether there is any inline inserted CSS, and execute it if there is, and ignore other CSS for this sentence. It's there; secondly, check the CSS in the header mode, and execute it if there is any; if there are neither of the first two, then check the CSS in the external file mode. Therefore, it can be seen that the execution priorities of the three CSS are: inline insertion, header mode, and external file mode.

css syntax:

<style type="text/css">

/*Write css style*/

< /style>

One benefit of using CSS styles is that by defining a certain style, text in different web page locations can have a unified font, font size or color, etc.

So let’s write an example :

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<style type="text/css">
		body{
			font-size: 20px;
			color: red;
			font-weight: bold;
		}
	</style>
</head>
<body>
		中华民族伟大复兴
</body>
</html>

In the above case, I defined a style for the body, so that all the content in the text will have this style

css reference manual, you can download one from Baidu, as shown in the figure below :

2.jpg##Next Section

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> body{ font-size: 20px; color: red; font-weight: bold; } </style> </head> <body> 中华民族伟大复兴 </body> </html>
submitReset Code
ChapterCourseware