HTML 符號

TML 符號實體

HTML 符號是不呈現(xiàn)在標準的鍵盤上，比如數(shù)學運算符、箭頭符號、技術(shù)符號和形狀。

如需向 HTML 頁面添加這些符號，您可以使用 HTML 實體名稱。

如果不存在實體名稱，您可以使用實體編號。

如果字符沒有實體名稱，您可以使用十進制（或十六進制）引用。

實例

結(jié)果如下：

我將顯示 €

HTML 支持的數(shù)學符號

如果您使用的是一個 HTML 實體名稱或一個十六進制編號，字符總是能正確顯示。

這是與您頁面使用的字符集相互獨立的！

字符	編號	實體	描述
?	∀	∀	所有（for all）
?	∂	∂	部分（part）
?	∃	∃	存在（exists）
?	∅	∅	空（empty）
?	∇	∇	倒三角（nabla）
∈	∈	∈	屬于（isin）
?	∉	∉	不屬于（notin）
?	∋	&ni;	包含的成員（ni）
∏	∏	∏	連乘（prod）
∑	∑	∑	總和（sum）

完整的數(shù)學（Math）參考手冊

HTML 支持的希臘字母

字符	編號	實體	描述
Α	Α	Α	Alpha（中文注音：阿耳法）
Β	Β	Β	Beta（中文注音：貝塔）
Γ	Γ	Γ	Gamma（中文注音：伽馬）
Δ	Δ	Δ	Delta（中文注音：德耳塔）
Ε	Ε	Ε	Epsilon（中文注音：艾普西隆）
Ζ	Ζ	Ζ	Zeta（中文注音：截塔）

完整的希臘（Greek）參考手冊

HTML 支持的其他實體

字符	編號	實體	描述
?	©	©	版權(quán)所有（REGISTERED SIGN）
?	®	®	注冊商標（REGISTERED SIGN）
€	€	€	歐元符號（EURO SIGN）
?	™	™	商標（trademark）
←	←	←	向左箭頭（LEFTWARDS ARROW）
↑	↑	↑	向上箭頭（UPWARDS ARROW）
→	→	→	向右箭頭（RIGHTWARDS ARROW）
↓	↓	↓	向下箭頭（DOWNWARDS ARROW）
?	♠	&spades;	黑桃（BLACK SPADE SUIT）
?	♣	&clubs;	黑梅花（BLACK CLUB SUIT）
?	♥	&hearts;	黑心（BLACK HEART SUIT）
?	♦	&diams;	黑方塊（BLACK DIAMOND SUIT）

如您還有不明白的可以在下面與我留言或是與我探討QQ群308855039，我們一起飛！

果給你一些文本文字，要讓它變得美，你將會采用什么方法？用過PPT的人都知道，可以調(diào)整顏色，可以設定字體，可以進行對齊、縮進等操作。這些在PPT中常用的方法，在CSS中也是很容易實現(xiàn)的，代碼也簡單。

10.1 文本顏色

在CSS中，設置文本顏色，用color屬性，值可為16進制、一個RGB值或顏色名稱。十六進制用#號開始，后接#RGB，比如 #ff0000；RGB值為rgb(255,0,51)形式；顏色名稱名稱直接就是英語單詞，如red。

樣色表ys2.css文件內(nèi)容

body {
       color:#00ff00;
}
h3 {
 color:CadetBlue;

}
p {
    color:rgb(0,0,255);
}

HTML文件內(nèi)容

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>字體顏色</title>
    <link rel="stylesheet" type="text/css" href="ys2.css"/>
</head>
<body>
<h3>年底了，還能找工作不?</h3>
<p>
    昨晚七點多收到通知，說老板抽查了幾次監(jiān)控，發(fā)現(xiàn)一些人上班渾水摸魚玩手機，
要召開緊急視頻會議，<br/>
    全體員工必須參會，視頻里老板很生氣，正火冒三丈的批評那些財務人員上班玩手機，
說再不多提升自己，<br/>
    以后早晚被電腦和機器代替， 然后我忘記關麥了，說了句：機器能替你吃牢飯？<br/>
    唉，也不知道年底了工作好不好找。</p>
</body>
</html>

輸出結(jié)果

10.2 文本字體

CSS字體屬性定義字體，加粗，大小，文字樣式。在用軟件時，你是不是見過宋體什么的，沒錯，那個就是字體了。在CSS中，可以使用Font Family："宋體"的方式指定字體；樣式，就是加粗、傾斜那個，用font-style指定；大小則用font-size。

/* ys2.css里的樣式表內(nèi)容 */
.f {
    font-family: "宋體";
    /* 加粗 */
    font-style: oblique;
    font-size: 40px;
}

<!--html文件內(nèi)容-->
<div class="f">
    牛的程序員，羊一樣的女孩
</div>

輸出結(jié)果

10.3 對齊方式

文本在元素內(nèi)水平對齊，可以使用 text-align: 值的方式，center居中對齊，left居左對齊，right居右對齊；垂直居中對齊，可用vertical-align和line-height結(jié)合的方式進行指定，這個平時會經(jīng)常用到，記下來。

/*css文件里的內(nèi)容*/

/*水平居中*/
.div-width {
    width: 800px;
}

.txt-left {
    text-align: left;
    color: aquamarine;
}

.txt-center {
    text-align: center;
    color: darkcyan;
}

.txt-right {
    text-align: right;
    color: darkgreen;
}

/*垂直居中*/
.txt-vertical {
    border: 2px solid green;
    height: 100px;
    line-height: 100px;
    vertical-align: middle;
    text-align: center;
}

<!-- HTML文件里的內(nèi)容 -->
<div class="div-width">
    <!--水平居中-->
    <p class="txt-left">向左看齊</p>
    <p class="txt-center">居中對齊</p>
    <p class="txt-right">向右看齊</p>
    <!--垂直居中-->
    <div class="txt-vertical">垂直居中方法1</div>
    <div>垂直居中方法2</div>
</div>

輸出結(jié)果

如果要對標簽進行水平居中的話，可以使用 margin: auto;用position: absolute; 屬性來對齊元素的話，有些瀏覽器不支持，所以不推薦。

/* 在樣式表文件中 */
.div-center {
    margin: auto;
    width: 50%;
    border: 1px solid green;
    height: 300px;
    text-align: center;
    vertical-align: center;
    line-height: 300px;
}
<!--在html文件中-->
<div class="div-center">我站在，人海中間：div在Web居中，文字在div中居中</div>

輸出結(jié)果

10.4 文本之距

為了讓閱讀舒服，在進行文本排版之時，會考慮字與字之間的間距，有行與行之間的距離，還有段落的縮進等。在CSS中，字符間距可用letter-spacing:值；行間距依然用line-height:值；段落字符縮進，用text-indent即可。溫馨提醒：text-indent只對div和p標簽有效。

/* 在樣式表文件中 */
.text-spacing {
    width: 900px;
    border: 1px solid green;
    letter-spacing: 50px;
}

p.row {
    line-height: 3.0em;
}

p.i {
    /*em是相對單位，2em即現(xiàn)在一個字大小的兩倍*/
    text-indent: 2em;
}
<!--在html文件中-->
<div class="text-spacing">
    他說風雨中，這點痛算什么
</div>
<p class="row">
    秋季降溫快的特點，使得秋收、秋耕、秋種的“三秋”大忙顯得格外緊張。<br/>
    秋分棉花吐絮，煙葉也由綠變黃，正是收獲的大好時機。華北地區(qū)已開始播種冬麥，<br/>
    長江流域及南部廣大地區(qū)正忙著晚稻的收割，搶晴耕翻土地，準備油菜播種。
</p>
<p class="i">
    當我以為我無法繼續(xù)走下去時，我強迫自己要繼續(xù)前進。<br/>
    我的成功是基于我的堅持，并非運氣。<br/>
    努力,是為了跳出你厭惡的圈子。<br/>
    讀書,是為了遠離渣貨垃圾人。<br/>
    健身,是為了讓討厭的人心平氣和...
</p>

輸出結(jié)果

好了，有關CSS文本或元素對齊的內(nèi)容，老陳講完了，如果覺得對你有所幫助，希望老鐵能轉(zhuǎn)發(fā)點贊，讓更多的人看到這篇文章。你的轉(zhuǎn)發(fā)和點贊，就是對老陳繼續(xù)創(chuàng)作和分享最大的鼓勵。

一個當了10年技術(shù)總監(jiān)的老家伙，分享多年的編程經(jīng)驗。想學編程的朋友，可關注：老陳說編程。分享Python，前端(小程序)、App和嵌入式方面的干貨。關注我，沒錯的。

#前端##HTML5##CSS##程序員##Web#

public String convertToReference(char character, String encoding) {
    if (encoding.startsWith("UTF-")) {
        switch(character) {
        case '"':
            return """;
        case '&':
            return "&";
        case '\'':
            return "'";
        case '<':
            return "<";
        case '>':
            return ">";
        }
    } else if (character < 1000 || character >= 8000 && character < 10000) {
        int index = character < 1000 ? character : character - 7000;
        String entityReference = this.characterToEntityReferenceMap[index];
        if (entityReference != null) {
            return entityReference;
        }
    }

    return null;
}

在線咨詢

上一篇：Angular第十九章：主頁面“index.html”
下一篇：JS｜鼠標事件交替顯示不同的圖片

您的項目需求

*請認真填寫需求信息，我們會在24小時內(nèi)與您取得聯(lián)系。

整合營銷服務商

HTML 符號

10.1 文本顏色

10.2 文本字體

10.3 對齊方式

10.4 文本之距

您的項目需求