這篇文章要跟大家介紹的內容是關於什麼是css？ css三種樣式以及文字屬性的介紹，有一定的參考價值，有需要的朋友可以參考一下，希望對你有幫助。
什麼是CSS？
Cascading Style Sheets，簡稱CSS，層疊樣式表。
用來修飾HTML文件，對網頁元素進行排版或大小控制等操作。
也就是說，HTML檔案填入了網頁的內容，而CSS則是控制內容的表現
例如：元素的大小，元素在網頁中的位置，元素的背景等屬性。
CSS程式碼寫在那裡？
1 內聯樣式(行內式)：css程式碼可以寫在html標籤中，使用style=”css樣式”;
<p style="color: red;">这是一个段落</p>
2 內部樣式:
把css程式碼寫在style標籤裡面
style標籤理論上寫在文件的任何位置都可以生效，但是我們都會把style寫在head標籤裡面
<html>
<head> ...
<style type="text/css">
css样式
</style>
</head>
</html>3 外部樣式：
外部樣式是把css程式碼單獨寫在一個css檔案(css後綴檔案)中
再使用link標籤把外部樣式檔案引入
外部樣式檔中不需要style標籤，直接寫css程式碼就可以了
<html>
<head> ...
<link rel="stylesheet" type="text/css" href="css文件路径" />
</head>
</html>三種樣式可以多種同時使用
文字屬性: font屬性
1 字體大小：font-size
設定字體的大小，使用有單位的值，例如px,em,pt等
font-size: 12px;
#2 字體顏色：color
color: red;
3 字型樣式：font-family
設定字體，例如宋體、雅黑之類的
可以有多個值
但只顯示一種字體樣式
若第一個字體可用就使用第一個，否則使用第二個
若第二個字體也不可用，就是用第三個，以此類推
字體與字體之間用英文逗號隔開，如果是中文或多個單字的值，要用英文雙引號包起來
font-family: "宋体",Times,"New Century Schoolbook";
4 字體粗細：font-weight
| #可選值 | 說明 |
|---|---|
| normal | 預設值，不加粗 |
| bold | |
| #bolder | ##加粗，效果比bold更明顯|
| 100~900的不含單位數值，一般100~500為正常效果，600~900為加粗，數值越大，字體越粗 |
5 文字的大小寫: text-transform
| 說明 | |
|---|---|
| 預設值，無效果 | |
| 首字母大寫 | |
| 全部大寫 | |
| 全部小寫 |
| right | |
| center | |
| justify | |
兩端對齊
| 7 文字垂直對齊方式 | |
|---|---|
| 說明 | |
| baseline | 預設。元素放置在父元素的基線上 |
| sub | 垂直對齊文字的下標 |
| super | 垂直對齊文字的上標 |
| top | 將元素的頂端與行中最高元素的頂端對齊 |
| text-top | 把元素的頂端與父元素字體的頂端對齊 |
| #middle | 把此元素放置在父元素的中間 |
| bottom | 把元素的頂端與行中最低的元素的頂端對齊 |
| text-bottom | 把元素的底端與父元素字體的底端對齊 |
| 8文字劃線: text-decoration | |
|---|---|
| 說明 | |
| none | 無底線 |
| #underline | 下劃線 |
| #overline | 上劃線 |
text-decoration: underline;
9 首行缩进: text-indent
该属性接受一个带单位的值
规定文本首行缩进多少个单位的空间
只对第一行有缩进，而且只用于块元素
text-indent: 2em;
text-indent的属性值一般会使用em作为单位，因为一般缩进都以多少个字符为标准
10字间距: letter-spacing
该属性接受一个带单位的值
规定每个字符之间间隔多少个单位的空间
letter-spacing: 1em;
11 词间距: word-spacing
该属性接受一个带单位的值
规定每个单词之间间隔多少个单位的空间
该属性对中文无效
相关文章推荐：
css三栏布局的三种实现方式（圣杯布局、双飞翼布局、Flex布局）
以上是什麼是css？ css三種樣式以及文字屬性的介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章！
webpagetest中的性能測試單頁應用程序的食譜Apr 15, 2025 am 09:42 AMWebPagetest是一個在線工具，也是一個開源項目，可幫助開發人員審核其網站的性能。作為網絡性能傳播者
熱AI工具
Undresser.AI Undress
人工智慧驅動的應用程序，用於創建逼真的裸體照片
AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。
Undress AI Tool
免費脫衣圖片
Clothoff.io
AI脫衣器
AI Hentai Generator
免費產生 AI 無盡。
熱門文章
熱工具
Dreamweaver CS6
視覺化網頁開發工具
Safe Exam Browser
Safe Exam Browser是一個安全的瀏覽器環境，安全地進行線上考試。該軟體將任何電腦變成一個安全的工作站。它控制對任何實用工具的訪問，並防止學生使用未經授權的資源。
SublimeText3 Linux新版
SublimeText3 Linux最新版
MantisBT
Mantis是一個易於部署的基於Web的缺陷追蹤工具，用於幫助產品缺陷追蹤。它需要PHP、MySQL和一個Web伺服器。請查看我們的演示和託管服務。
WebStorm Mac版
好用的JavaScript開發工具
