Home Web Front-end HTML Tutorial CSS3 learning selector, font_html/css_WEB-ITnose

CSS3 learning selector, font_html/css_WEB-ITnose

Jun 24, 2016 pm 12:05 PM
css3 font study Selector

??

Attribute selector:
[att*=val]{}If the att element attribute value contains the val specified character, use this style
[att^= val]{}If the starting character of the att element attribute value is val, use this style
[att&=val]{}If the ending character of the att element attribute value is val, use this style

Example:

<style type="text/css">[id^=section1]{		background-color: yellow;	}</style>
Copy after login

<div id="section2">示例文本2</div>	<div id="subsection1">示例文本1-1</div>	<div id="subsection2">示例文本1-2</div>	<div id="subsection2-1">示例文本2-1</div>	<div id="subsection2-2">示例文本2-2</div>
Copy after login


target selection Server:

When the href jumps within the page, redefine the attributes of the target


font font: The special fonts applied in the previous version of the web page were only used by the client The font can be displayed normally only when the font is available on the client,

and css3 supports obtaining fonts from the server, which means that if you put the font file in the font folder, you can use this font directly through the url

This new change really brings great convenience. Example:

@font-face{		font-family: WebFont;		src:url('font/FZJZFW.TTF') format("truetype");		font-weight: normal;	}
Copy after login
article{		font-family: WebFont;	}
Copy after login

<article>	<h1>文章内容</h1>	<p>网页级内容区块的正文</p>	<section>		<h3>section级内容的正文</h3>		<p>section级内容区块的正文</p>	</section></article>
Copy after login



Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

Repo: How To Revive Teammates
1 months ago By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
2 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: How To Get Giant Seeds
1 months ago By 尊渡假赌尊渡假赌尊渡假赌

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

How to change the font in Outlook on Apple mobile phone How to change the font in Outlook on Apple mobile phone Mar 08, 2024 pm 04:46 PM

How to change the font in Outlook on Apple mobile phone? First open the Outlook software and click on the file in the upper left corner of the interface. You can set the font according to your own preferences. After the settings are completed, click the OK button. Let’s take a look! How to change the font in Outlook on Apple mobile phone 1. Open the Outlook software and click the "File" option in the upper left corner of the interface. 2. In the list that appears, find "Options" and click to enter. 3. On the left side of the option list, click "Mail". 4. Next, select “Letter and Fonts”. 5. If you want to set the font for new emails, reply emails, or composing, click the corresponding option to enter the settings. 6. Set the font according to personal preference. After the setting is completed, click OK

How to make vivo mobile phone font larger and where to set it How to make vivo mobile phone font larger and where to set it Feb 24, 2024 pm 06:16 PM

How to make the font size of vivo mobile phone larger? Where can I set it? In vivo mobile phone, you can make the font size larger, but most users don’t know how to set the font size of vivo mobile phone. Next, the editor brings you the settings of how to make the font size of vivo mobile phone larger. Method graphic tutorials, interested users come and take a look! Vivo mobile phone usage tutorial How to make the font size of vivo mobile phone larger Where to set it 1. First open the [Settings] function in the vivo mobile phone and click on it; 2. Then jump to the settings interface and find the [Display and Brightness] function; 3. Then Reach the page in the picture below and click the [Font Size and Thickness] service; 4. Finally, slide the horizontal line in the picture below to adjust the font size.

How to change the font of Xiaomi 11_How to change the font of Xiaomi 11 How to change the font of Xiaomi 11_How to change the font of Xiaomi 11 Mar 25, 2024 pm 07:26 PM

1. Open the phone settings and click [Display]. 2. Click [Font]. 3. Select the font you like or click [More Fonts] to download the application.

How to change fonts in mobile QQ browser How to change fonts in mobile QQ browser Apr 07, 2024 pm 06:43 PM

How to change the font in mobile QQ browser? Many people like to use QQ browser on mobile phones. This browser can not only browse web pages quickly, but also process various types of file data. Moreover, this browser also has personalized settings. You can set the font of the browser according to your own preferences. , many novice users still don’t know how to change the fonts of this browser. This article will give you an overview of the steps to change fonts in mobile QQ browser, hoping to help you solve the problem. List of steps to change fonts in mobile QQ Browser 1. Turn on the phone, and then click to open "QQ Browser" (as shown in the picture). 2. On the "My" page of QQ Browser, click the "Settings" logo in the upper right corner (as shown in the picture). 3. In the settings, click to enter "Font Settings" (as shown in the figure)

Revealing the appeal of C language: Uncovering the potential of programmers Revealing the appeal of C language: Uncovering the potential of programmers Feb 24, 2024 pm 11:21 PM

The Charm of Learning C Language: Unlocking the Potential of Programmers With the continuous development of technology, computer programming has become a field that has attracted much attention. Among many programming languages, C language has always been loved by programmers. Its simplicity, efficiency and wide application make learning C language the first step for many people to enter the field of programming. This article will discuss the charm of learning C language and how to unlock the potential of programmers by learning C language. First of all, the charm of learning C language lies in its simplicity. Compared with other programming languages, C language

Getting Started with Pygame: Comprehensive Installation and Configuration Tutorial Getting Started with Pygame: Comprehensive Installation and Configuration Tutorial Feb 19, 2024 pm 10:10 PM

Learn Pygame from scratch: complete installation and configuration tutorial, specific code examples required Introduction: Pygame is an open source game development library developed using the Python programming language. It provides a wealth of functions and tools, allowing developers to easily create a variety of type of game. This article will help you learn Pygame from scratch, and provide a complete installation and configuration tutorial, as well as specific code examples to get you started quickly. Part One: Installing Python and Pygame First, make sure you have

How to change the font on an Apple phone How to change the font on an Apple phone How to change the font on an Apple phone How to change the font on an Apple phone Mar 22, 2024 pm 08:11 PM

1. Through settings, enter and modify the font style of the mobile phone system. 2. Open the phone settings and enter [Accessibility]. 3. Click [Subtitles and Closed Subtitles]. 4. Click [Style] to make modifications.

Let's learn how to input the root number in Word together Let's learn how to input the root number in Word together Mar 19, 2024 pm 08:52 PM

When editing text content in Word, you sometimes need to enter formula symbols. Some guys don’t know how to input the root number in Word, so Xiaomian asked me to share with my friends a tutorial on how to input the root number in Word. Hope it helps my friends. First, open the Word software on your computer, then open the file you want to edit, and move the cursor to the location where you need to insert the root sign, refer to the picture example below. 2. Select [Insert], and then select [Formula] in the symbol. As shown in the red circle in the picture below: 3. Then select [Insert New Formula] below. As shown in the red circle in the picture below: 4. Select [Radical Formula], and then select the appropriate root sign. As shown in the red circle in the picture below:

See all articles