*怎么設置字體
想用CSS設置字體樣式,首先得了解CSS 字體屬性,CSS 字體屬性可以定義文本的字體系列、大小、加粗、風格(如斜體)和變形(如小型大寫字母)。
如下:font 簡寫屬性。作用是把所有針對字體的屬性設置在一個聲明中。
font-family 設置字體系列。 font-size 設置字體的尺寸。
font-size-adjust 當首選字體不可用時,對替換字體進行智能縮放。(CSS2.1 已刪除該屬性。)
font-stretch 對字體進行水平拉伸。(CSS2.1 已刪除該屬性。)
font-style 設置字體風格。 font-variant 以小型大寫字體或者正常字體顯示文本。
font-weight 設置字體的粗細。 如果你希望文檔使用一種字體可以這樣 body {font-family: sans-serif;} 指定字體系列,如下,這樣所有h1標簽里面的字體就定義好了 h1 {font-family: Georgia;} 其中他們優先級是 h1>body 注意:如果讀者沒有安裝 Georgia字體,會默認為其他字體,如果您對字體非常熟悉,也可以為給定的元素指定一系列類似的字體。
要做到這一點,需要把這些字體按照優先順序排列,然后用逗號進行連接:p {font-family: Times, TimesNR, 'New Century Schoolbook', Georgia, 'New York', serif;} 如果把一個 font-family 屬性放在 HTML 的 style 屬性中,則需要使用該屬性本身未使用的那種引號如:。 字體風格 font-style 屬性最常用于規定斜體文本。
該屬性有三個值:?normal - 文本正常顯示 ?italic - 文本斜體顯示 ?oblique - 文本傾斜顯示 實例 * {font-style:normal;} * {font-style:italic;} *e {font-style:oblique;} 字體變形 font-variant 屬性可以設定小型大寫字母。小型大寫字母不是一般的大寫字母,也不是小寫字母,這種字母采用不同大小的大寫字母。
實例 p {font-variant:small-caps;} 字體加粗 font-weight 屬性設置文本的粗細。使用 bold 關鍵字可以將文本設置為粗體。
關鍵字 100 ~ 900 為字體指定了 9 級加粗度。如果一個字體內置了這些加粗級別,那么這些數字就直接映射到預定義的級別,100 對應最細的字體變形,900 對應最粗的字體變形。
數字 400 等價于 normal,而 700 等價于 bold。如果將元素的加粗設置為 bolder,瀏覽器會設置比所繼承值更粗的一個字體加粗。
與此相反,關鍵詞 lighter 會導致瀏覽器將加粗度下移而不是上移。實例 * {font-weight:normal;} * {font-weight:bold;} *r {font-weight:900;} 字體大小 font-size 屬性設置文本的大小。
有能力管理文本的大小在 web 設計領域很重要。但是,您不應當通過調整文本大小使段落看上去像標題,或者使標題看上去像段落。
請始終使用正確的 HTML 標題,比如使用
- 來標記標題,使用 來標記段落。font-size 值可以是絕對或相對值。
絕對值:?將文本設置為指定的大小 ?不允許用戶在所有瀏覽器中改變文本大小(不利于可用性) ?絕對大小在確定了輸出的物理尺寸時很有用 相對大小:?相對于周圍的元素來設置大小 ?允許用戶在瀏覽器改變文本大小 注意:如果您沒有規定字體大小,普通文本(比如段落)的默認大小是 16 像素 (16px=1em)。使用像素來設置字體大小 通過像素設置文本大小,可以對文本大小進行完全控制:實例 h1 {font-size:60px;} h2 {font-size:40px;} p {font-size:14px;}。
*設置字體格式的代碼
HTML標簽:
<b>;粗體格式</b>
<i>;斜體格式</i>
<small>;小字體格式</small>
<font size="2">;這一段的字體大小的值是2。</font>
<font fac="arial">;這一段的字體是arial。</font>
文字<sub>;下標</sub>;格式
文字<sup>;上標</sup>;格式
CSS格式:
#span1 {font-weight:bold; /*粗體*/<br>font-size:16px;/*字體大小*/<br>font-family:arial;/*字體為arial*/<br>color:#ff0000;/*顏色紅色*/<br>background-color:#fffff/*背景色白色*/<br>}
*怎么設置字體
最簡單的設置背景顏色:
找到<body>;標記,在里面打個空格輸入bgcolor="這里寫顏色的英文,也可以是16進制,如"#0099FF".
想插背景圖片輸background="這里是圖片地址"
若要改文字顏色.在文字兩端加<font>;標記,在里面輸入color="寫英文或16進制,同上!"
整體效果:
<font color="#0099FF" size="1">;這里是文字</font>; //后面的size控制字體大小
若想用樣式控制,全部代碼如下:
<html>
<head>
<title></title>
<style type="text/css">; //這里是CSS樣式聲明
<;!-- //這是防止瀏覽器無法識別用的!不用管
body {
background-color: #0033FF;
} //背景顏色樣式,采用標簽選擇符樣式
.font{color: #33CC00}
//字體顏色樣式,采用類選擇符樣式,用class 調用
-->
</style>
</head>
<body>; //這里調用標簽選擇符樣式
<span class="font">;字體的顏色</span>; //這里調用類選擇符樣式
</body>
</html>
*文字大小代碼
一般標簽內都有style屬性,在style屬性里面通過font-size就可以定義的<font style="font-size:12px">;文字</font>
<span style="font-size:12px">;文字</span>
另外
<font size="30">;文字</font>
<h1>;文字</h1>
<h2>;文字</h2>
<h3>;文字</h3>
..
還有好多就不列舉了。
*常用的字體樣式
font-family:'Microsoft YaHei'。
1、網頁字體樣式華文黑體:STHeiti2、網頁字體樣式華文楷體:STKaiti3、網頁字體樣式華文宋體:STSong4、網頁字體樣式華文仿宋:STFangsong5、網頁字體樣式黑體:SimHei6、網頁字體樣式宋體:SimSun7、網頁字體樣式新宋體:NSimSun8、網頁字體樣式仿宋:FangSong9、網頁字體樣式楷體:KaiTi10、網頁字體樣式仿宋_GB2312:FangSong_GB231211、網頁字體樣式楷體_GB2312:KaiTi_GB231212、網頁字體樣式微軟正黑體:Microsoft JhengHei13、網頁字體樣式微軟雅黑體:Microsoft YaHei14、網頁字體樣式隸書:LiSu15、網頁字體樣式幼圓:YouYuan16、網頁字體樣式華文細黑:STXihei17、網頁字體樣式華文楷體:STKaiti18、網頁字體樣式華文宋體:STSong19、網頁字體樣式華文中宋:STZhongsong20、網頁字體樣式華文仿宋:STFangsong21、網頁字體樣式方正舒體:FZShuTi22、網頁字體樣式方正姚體:FZYaoti23、網頁字體樣式華文彩云:STCaiyun24、網頁字體樣式華文琥珀:STHupo25、網頁字體樣式華文隸書:STLiti26、網頁字體樣式華文行楷:STXingkai27、網頁字體樣式華文新魏:STXinwei 擴展資料 html內容描述
最大的標題(一號標題) 預先格式化文本 (英文全稱:PREformatted) 下劃線(英文全稱:Underline) 黑體字 (英文全稱:Bold) 斜體字 (英文全稱:Italics)打字機風格的字體引用,通常是斜體 強調文本(通常是斜體加黑體、英文全稱:EMphasize) 加重文本(通常是斜體加黑體) 設置字體大小從1到7,顏色使用名字或RGB(中文全稱:紅綠藍)的十六進制值
程式碼鍵盤字(英文全稱:KeyBoarD) 范例(英文全稱:SAMPle) 變量(英文全稱:VARiable) 向右縮排(向右縮進、塊引用) 述語定義(英文全稱:DeFiNe)地址標記 上標字 (英文全稱:SUPerscript) 下標字(英文全稱:SUBscript);固定寬度字體(不執行標記符號)
;字體 顏色。;字體 大小等于1(最小)。
;字體 樣式等于無限增大(100像素) 參考資料:搜狗百科:HTML。
*如何調整文字位置
1、html中調整位置使用css的float屬性。詳細用法首先在html文件中新建兩個div容器,用來方便演示效果,容器中都加入h2標簽,設置不同文字便于區分:
2、div標簽給它在style標簽設置class屬性的樣式,給它高度和寬度以及顏色,h2標簽一個使用float屬性,另一個不使用。這里float標簽的作用可以讓文字居左或者居右顯示,也可以設置為空,最后Crtl+S保存文件:
3、打開瀏覽器,可以看到兩個div中的文字位置并不相同,設置了float標簽的文字在靠右的位置。以上就是html調整文字位置的方法:
轉載請注明出處華閱文章網 » HTML簡短設置字體