Three common style selectors in html css

1: Tag selector

The tag selector is used for all tags. Here we take p as an example, that is, all the tags with p will have this style.

Copy code

The code is as follows:

<html>
<head>
<styletype="text/css">
p{font:"宋体"; color:#FF0000}
</style>
</head>
<body>
<pid="p1">I am now showing the tag selector</p>
<pid="p2">I also use the tag selector</p>
<h1>I am not modified by any selector</h1>
</body>
</html>

2: id selector . Note that the id selector is unique, because only id="yy" has this style, and the ID of an element in a page must be unique, so. . . You know that the id selector starts with # and is used as follows: id=""

Copy code

The code is as follows:

<html>
<head>
<styletype="text/css">
#yy{font:"宋体"; color:#FF0000}
</style>
</head>
<body>
<pid="yy">I am now showing the id selector</p>
<pid="p">I am not modified by the id selector</p>
<h1>I am not modified by any selector</h1>
</body>
</html>

3: Class selector . Class selectors start with . Just set the element's class="" to display this style. The usage is: class=""

Copy code

The code is as follows:

<html>
<head>
<styletype="text/css">
.yy{font:"宋体"; color:#FF0000}
</style>
</head>
<body>
<pclass="yy">I am now showing the class selector</p>
<pclass="yy">I am not modified by the class selector</p>
<h1>I am not modified by any selector</h1>
</body>
</html>

<<: Centos8.3, docker deployment springboot project actual case analysis

>>: CSS perfectly solves the problem of front-end image deformation

Detailed explanation of how to use $props, $attrs and $listeners in Vue

Three common style selectors in html css

Detailed explanation of how to use $props, $attrs and $listeners in Vue

HTML table tag tutorial (34): row span attribute ROWSPAN

MYSQL transaction tutorial Yii2.0 merchant withdrawal function

Solution for importing more data from MySQL into Hive

How to define input type=file style

Some lesser-known sorting methods in MySQL

Detailed tutorial on migrating the home directory to a new partition under Ubuntu

MySQL slow query and query reconstruction method record

Vue implements the sample code of adding, deleting, modifying and checking the tree structure

Linux super detailed gcc upgrade process

Recommend

A simple way to put HTML footer at the bottom of the page

Detailed explanation of error handling examples in MySQL stored procedures

Native js to achieve star twinkling effect

33 ice and snow fonts recommended for download (personal and commercial)

Angular Dependency Injection Explained

Detailed explanation of the difference between uniapp and vue

Methods of adaptive web design (good access experience on mobile phones)

HTML sets bold, italic, underline, strikethrough and other font effects

Vue implements the shake function (compatible with ios13.3 and above)

js array entries() Get iteration method

How to connect JDBC to MySQL 5.7

Detailed explanation of the order of Mysql query results according to the order of ID in in()

Solve nginx "504 Gateway Time-out" error

Four categories of CSS selectors: basic, combination, attribute, pseudo-class

javascript implements web version of pinball game