HTML和CSS前端教程03-CSS文本樣式

bitkylin 發布于2019-04-23 11:52 / 2217人閱讀

摘要：目錄顏色建議就用十六進制長度的度量單位建議就用文本樣式字體屬性文本樣式顏色建議就用十六進制顏色建議就用十六進制長度的度量單位建議就用長度的度量單位建議就用文本樣式文本樣式字體的大小，樣式以及方位字體屬性字體屬性屬性名說明例子

1.CSS顏色-建議就用十六進制
2.CSS長度的度量單位-建議就用px
3.CSS文本樣式
- 3.1. 字體屬性
- 3.1. 文本樣式

1.CSS顏色-建議就用十六進制

p{
  color: #ff0000
}

2.CSS長度的度量單位-建議就用px

p{
  margin: 0;
  padding: 0;
  font-size: 20px;
  height: 50px;
}

3.CSS文本樣式

字體的大小，樣式以及方位

3.1. 字體屬性

屬性名	說明	例子
`font-size`	字體大小	`font-size: 50px`
`font-variant`	英文字體是否轉為小型字母	`font-variant: small-caps` `font-variant: normal`
`font-style`	字體傾斜	`font-style: italic` `font-style: normal`
`font-weight`	字體加粗	`font-weight: bold`
`font-family`	font字體	`font-family: 微軟雅黑`
`font`	字體樣式復合寫法	`font: italic bold small-caps 50px 楷體`
`@font-face`	設置Web字體

3.1. 文本樣式

屬性名	說明	參數
`text-decoration`	z裝飾文本出現各種劃線	underline：底部線條 overline：頭部線 line-through:中間刪除線
`text-transform`	大寫換成小寫	uppercase:轉成大寫 lowercase：轉成小寫 capitalize:首字母大寫
`text-shadow`	添加陰影	5px(水平偏移),5px(垂直偏移),3px(模糊度),black(顏色)
`text-align`	設置對齊方式	center：居中 left right justify：兩端對齊
`white-space`	排版中的空白處理方式	normal: 空白符壓縮，文本自動換行 nowrap:空白符壓縮，文本不換行 pre:空白符保留，遇到換行符換行 pre-line:空白符壓縮，文本排滿時換行
`letter-spacing`	設置字母之間的間距	`letter-spacing: 4px`
`word-spacing`	設置單詞之間的間距	`letter-spacing: 4px`
`line-height`	設置行高	`line-height: 200%`
`word-wrap`	控制段詞,讓國產的單詞斷開	`word-wrap:break-word`
`text-indent`	設置文本首行縮進

GPU云服務器云服務器文本樣式html html中css樣式 html的css樣式 html.css教程

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/1275.html

HTML和CSS前端教程03-CSS選擇器

摘要：目錄定義創建的三種方法元素內嵌權重最高文檔內嵌外部引用層疊和繼承瀏覽器樣式樣式表層疊樣式繼承選擇器選擇器的總匯基本選擇器復合選擇器偽元素選擇器偽類選擇器定義定義層疊樣式表創建的三種方法創建的三種方法元素內嵌權重最高元素內嵌權重最高文檔內目錄 1. CSS定義 2. 創建CSS的三種方法 2.1. 元素內嵌（權重最高）...

PingCAP 2019-04-23 11:52 評論0 收藏0
CSS開發

摘要：譯十六進制顏色揭秘原文地址原文作者譯文出自掘金翻譯計劃本文永久鏈接教程入門篇關于是一款進行柵格布局的輔助工具，它讓開發者擺脫了冗雜的數學計算，同時降低了樣式與結構的耦合程度。【譯】CSS 十六進制顏色揭秘原文地址：CSS Hex Colors Demystified 原文作者：Dave Gash 譯文出自：掘金翻譯計劃本文永久鏈接：https://github.com/xitu/...

warkiz 2019-08-30 13:54 評論0 收藏0
前端修煉の道 | 帶你走進迷人的 CSS 世界

摘要：每條屬性聲明實現對網頁元素進行某種特定格式的設置，由一個屬性和一個值組成，屬性和值之間使用冒號連接，不同聲明之間用分號分隔，所有屬性聲明放到一對大括號中。 showImg(https://segmentfault.com/img/bVbkQCI?w=900&h=383); showImg(https://segmentfault.com/img/bVbkQCO?w=900&h=383)...

shiweifu 2019-08-23 13:58 評論0 收藏0
保姆級教程HTML兩萬字筆記大總結【建議收藏】（上篇）

摘要：標簽不區分大小寫，但推薦小寫。標簽可以嵌套，但不能交叉嵌套。標簽也稱為元素。比如行內標簽亦可成行內元素。 ??HTML必備知識詳解?? 第一部分：HTML框架簡介...

paulli3 2021-10-13 09:40 評論0 收藏0
JavaScript DOM

摘要：但上述兩個情況中都是同一份文檔。提示對象是對象的一部分，可通過屬性對其進行訪問。返回包含指定節點的子節點的集合，該集合為即時更新的集合。對象在中，對象表示元素屬性節點的無序集合。 DOM簡介（ Document Object Model 文檔對象模型） W3C W3C 文檔對象模型（DOM）是中立于平臺和語言的接口，它允許程序和腳本動態地訪問和更新文檔的內容、結構和樣式。W3C D...

Nekron 2019-08-20 16:38 評論0 收藏0