CSS selectors
CSS selector
#CSS selector is divided into two types
Id and Class Selectors
#If you want to set CSS styles in HTML elements, you need to set the "id" and "class" selectors in the element.
#id selector
The id selector can specify a specific style for HTML elements marked with a specific id. The HTML element uses the id attribute to set the id selector, and the id selector in CSS is defined with "//m.sbmmt.com/global/code/#". The following style rules apply to the element attribute id="para1": <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<style>
#para1
{
text-align:center;
color:red;
}
</style>
</head>
<body>
<p id="para1">php中文网(php.cn)</p>
<p>这一段不受css样式影响。</p>
</body>
</html>Run the program to try it The ID attribute should not start with a number. IDs starting with numbers do not work in Mozilla/Firefox browsers. 
class selector
class selector is used to describe the style of a group of elements. The class selector is different from the id selector. , class can be used in multiple elements. The class selector is represented by the class attribute in HTML. In CSS, the class selector is displayed with a dot ".": In the following example, all objects with the center class HTML elements are all centered.Example
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<style>
.center
{
text-align:center;
}
</style>
</head>
<body>
<h1 class="center">标题居中</h1>
<p class="center">段落居中。</p>
</body>
</html>Run the program to try itYou can also specify specific HTML elements using classes. In the following example, all p elements use class="center" to center the text of the element:
Example
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<style>
p.center
{
text-align:center;
}
</style>
</head>
<body>
<h1 class="center">这个标题将不会受到影响</h1>
<p class="center">这一段将居中对齐</p>
</body>
</html>Run the program and try itThe first character of the class name cannot use numbers! It won't work in Mozilla or Firefox. 
new file
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<style>
#para1
{
text-align:center;
color:red;
}
</style>
</head>
<body>
<p id="para1">php中文网(php.cn)</p>
<p>这一段不受css样式影响。</p>
</body>
</html>
Preview
Clear
- Course Recommendations
- Courseware download
The courseware is not available for download at the moment. The staff is currently organizing it. Please pay more attention to this course in the future~
Students who have watched this course are also learning
Let's briefly talk about starting a business in PHP
Quick introduction to web front-end development
Large-scale practical Tianlongbabu development of Mini version MVC framework imitating the encyclopedia website of embarrassing things
Getting Started with PHP Practical Development: PHP Quick Creation [Small Business Forum]
Login verification and classic message board
Computer network knowledge collection
Quick Start Node.JS Full Version
The front-end course that understands you best: HTML5/CSS3/ES6/NPM/Vue/...[Original]
Write your own PHP MVC framework (40 chapters in depth/big details/must read for newbies to advance)