用Html實體制作三角形圖標
之前寫過用css來制作三角形圖標。這次寫的是用Html實體來制作三角形圖標，也是無需圖片，可以很方便的更改三角形圖標的大小和顏色。<br/>下面一起看下是怎么制作的。
操作方法
-
01
首先看下我們的html代碼，
如圖，例子代碼很簡單，就是一個div，div里的內容是html實體符號：▲，
這個符號最終顯示的是一個三角形。 -
02
頁面運行結果，如圖，一個標準的三角形圖標，
-
03
我們為這個三角形圖標，添加一些樣式，改變三角形圖標的大小和顏色。
樣式也代碼很簡單，就是加上字體大小，字體顏色的樣式代碼，如圖 -
04
刷新頁面，顯示效果如圖，已經是一個很漂亮的三角形圖標了。
-
05
只能是一個向上的三角形圖標嗎？
不是的，可以有其他方向的三角形，我們在html里再加一個向右的三角形，html代碼如圖， -
06
刷新頁面，就會看到二個方向的三角形圖標了，
-
07
同理，我們再加上其他二個方向的三角形圖標，代碼如圖，
（這里不同的方向圖標，其實是由不同的html實體符號來實現的，
符號：▲ 代表的是向上的三角形，
符號：► 代表的是向右的三角形，
符號：▼ 代表的是向下的三角形，
符號：◄ 代表的是向左的三角形， -
08
讓三角形圖標顯示不一樣的大小，不一樣的顏色，樣式代碼如圖
-
09
最終效果如圖，四個方向的三角形圖標，可以定義顏色，大小。
- End
- 發表于 2017-09-04 00:00
- 閱讀 ( 1282 )
- 分類：電腦網絡
admin
0 篇文章
作家榜 ?
-
xiaonan123
189 文章
-
湯依妹兒
97 文章
-
luogf229
46 文章
-
jy02406749
45 文章
-
小凡
34 文章
-
Daisy萌
32 文章
-
我的QQ3117863681
24 文章
-
華志健
23 文章