Shulou(Shulou.com)06/02 Report--

Editor to share with you what are the selectors in CSS, I believe most people do not know much about it, so share this article for your reference, I hope you can learn a lot after reading this article, let's go to know it!

CSS basics: selector

Selector Overview:

CSS and Pictures

CSS and browser

CSS Common Properties

CSS3 text and font related styl

Not selector:

If you want to style a structure element, but you want to exclude the substructure elements under this structure element so that it does not use this style, use the not selector.

Empty selector:

The Empty selector is used to specify the style to be used when the content of the element is blank.

Target selector:

The Target selector works on links within the page.

First-child, last-child, nth-child, and nth-last-child:

First, let's take a look at the effect pictures of First-child and last-child:

Let's take a look at the effects of nth-child and nth-last-child:

CSS3 fonts:

CSS3@font-face rule

Before CSS3-web designers must use fonts that have been installed on the user's computer.

In CSS3, store the font file on the web server, and it will be automatically downloaded to the user's computer when needed.

CSS3 fonts-browser support:

Firefox, Chrome, Safari, and Opera support fonts of .ttf (True TypeFonts) and .otf (OpenType Fonts) types.

Internet Explorer 9 + supports the new @ font-face rule, but only supports fonts of type .eot (Embedded OpenType).

CSS3 Font-Font reference:

Reference the name of the font through the font-family property

Example:

Media Queries related styles:

Media Queries module has been added to CSS3, which allows the addition of media query (Media query) expressions.

Example:

@ media screen and (min-width:1000px) {

Here, when the screen width is greater than 1000 pixels, the referenced stylesheet should be written in this curly braces.

}

@ media screen and (min-width:640px) and (max-width:999px) {

Here, the screen width is more than 640 and less than 940. The referenced stylesheet should be written in this curly braces.

}

@ media screen and (max-width:639px) {

Here, the screen width is less than 639, and the referenced stylesheet should be written in this curly braces

}

Here I only list a few selectors, css has a lot of selectors, specific reference: http://www.w3school.com.cn/cssref/css_selectors.asp

The following figures are actually defined in css3

The above is all the content of the article "what are the selectors in CSS?" Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.