This article introduces to you what is css? The introduction of the three CSS styles and text attributes has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.
What is CSS?
Cascading Style Sheets, referred to as CSS, cascading style sheets.
Used to modify HTML files and perform operations such as typesetting or size control on web page elements.
In other words, the HTML file fills the content of the web page, while CSS controls the performance of the content
For example: the size of the element, the position of the element in the web page, the background of the element and other attributes.
Where is the CSS code written?
1 Inline style (inline): css code can be written in html tags, use style="css style";
<p style="color: red;">这是一个段落</p>
2 Internal style:
Write the css code in the style tag
In theory, the style tag can be written anywhere in the document to take effect, but we will all write the style in the head tag
<html>
<head> ...
<style type="text/css">
css样式
</style>
</head>
</html>3 External style:
External style is to write the css code separately in In a css file (css suffix file)
Then use the link tag to introduce the external style file
There is no need for style tags in external style files, just write css code directly
<html>
<head> ...
<link rel="stylesheet" type="text/css" href="css文件路径" />
</head>
</html>Three styles can be used in multiple ways at the same time
Text attribute: font attribute
1 Font size: font-size
Set the font size, use values with units, such as px, em, pt, etc.
font-size: 12px;
2 Font color: color
color: red;
3 Font style: font-family
Set the font, such as Song Dynasty, Yahei and the like
Can have multiple values
But only one font style is displayed
If the first font is available, use the first one, otherwise use the second one
If the second font is not available, use the third one, and so on
Fonts are separated by English commas. If the value is Chinese or multiple words, it must be enclosed in English double quotes
font-family: "宋体",Times,"New Century Schoolbook";
4 Font-weight: font-weight
| Optional values | Description |
|---|---|
| Default value , no bold | |
| bold, the effect is better than Bold is more obvious | |
| 100~900 is a value without units. Generally, 100~500 is the normal effect, and 600~900 is bold. The larger the value, The bolder the font |
| Description | |
|---|---|
| capitalize | |
| uppercase | |
| lowercase | |
| right | |
| center | |
| justify | |
| sub | |
| super | |
| top | |
| text-top | |
| middle | |
| bottom | |
| text-bottom | |
| inherit | |
8Text-decoration
##Optional value
| underline | |
| overline | |
| line-through | |
text-decoration: underline; Copy after login 9 首行缩进: text-indent 该属性接受一个带单位的值 text-indent: 2em; Copy after login text-indent的属性值一般会使用em作为单位，因为一般缩进都以多少个字符为标准 10字间距: letter-spacing 该属性接受一个带单位的值 letter-spacing: 1em; Copy after login 11 词间距: word-spacing 该属性接受一个带单位的值 相关文章推荐： css三栏布局的三种实现方式（圣杯布局、双飞翼布局、Flex布局） The above is the detailed content of What is css? Introduction to three css styles and text attributes. For more information, please follow other related articles on the PHP Chinese website!
Previous article：How to use css to change the font color when the mouse moves over it? (Code actual test)
Next article：How to achieve underline css when the mouse passes over a field? (Navigation bar code example)
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
Latest Articles by Author
Latest Issues
PX automatic conversion to REM error
<style>html { font-size: calc(100vw / 3.75); }...
From 2024-04-16 09:34:16
0
0
4687
Related Topics
More>
Popular Recommendations
Popular Tutorials
More>
Latest Downloads
More>
|
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
