当前位置: 首页 > 图文教程 > 网页制作 > HTML/XHTML教程 > HTML Symbol Entities美化网页小图标

HTML/XHTML教程
showModelessDialog()使用详解
UBB 转换函数演示
用js封装的时间设置器
跟我学XSL(一)
跟我学XSL(二)
深入了解CSS的继承性及其应用
从HTML语言到网上家园 序章
从HTML语言到网上家园 第一章 HTML语言结构
从HTML语言到网上家园 第六章 表单
由显示/隐藏引出的CSS Bug
在因特网上建设自己的家园
主页设计中配色方案的使用(上)
什么是Web设计-Web设计的金字塔
什么是Web设计-为用户设计
什么是Web设计-建设Web站点
什么是Web设计-从纸张到软件
家园更美丽:网页制作秘籍
从菜鸟到准网页设计师
突破网页文字无法复制局限
网页制作超级技巧(一)

HTML/XHTML教程 中的 HTML Symbol Entities美化网页小图标


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2010-01-30   浏览: 163 ::
收藏到网摘: n/a

  ©<>这几个字符您一定不陌生吧,下面这几个呢? ›»«如果您还知道那再看这几个呢?☎☠✎ ✓下面来看看他们的在网页中的真面目吧 

  & nbsp;& copy;& lt;<& gt;& rsaquo;& raquo;& laquo;& #9742;& #9760;& #9998;& #10003;依次为空格©<<>›»«☎☠✎✓


  看到这您是不是有点晕,不知道我在什么,下面贴几张图您就明白了。




您发现了没有,图中的文字中用到了许多修饰的小图标,是不是给界面的美观增色不少?是的,合理的运用这些小图标既可以使轻松指引读者还可以从细节上为网页整体增色,何乐而不为呢?那么是不是要去搜集一些类似的小图标呢?答案是不用。那些事只有美工才需要,我们一向比较懒,所以我们就…

今天的主角闪亮登场→HTML Symbol Entities。那么为什么要使用字符而不使用小图标呢好处有哪些呢?

1.它比图标加载速度快;

2.它的大小可以随字体的大小而变化;

3.它可以随意改变颜色。

下面用☎做个demo,

正常情况:


以下为引用的内容:

<p>正常电话图标:☎</p>

正常电话图标:☎


改变字体大小:

以下为引用的内容:

<p style="font-size:26px;">大号电话图标:☎</p>

大号电话图标:☎


改变颜色:

以下为引用的内容:

<p style="color:Red;font-size:26px;">大号红色图标:☎</p>

大号红色图标:☎


是不是很简单,用起来很爽呢?但是有人又会问:“这么多字符我怎么记得住每个对应的代码是什么?”如果您是观察仔细的人,可能会发现其实基本上每个字符都有对应的名字,而且都是英文的缩写如:©;就是copyright的缩写,←就是left arrow的缩写,是不是很好记呢?如果您还是懒的记,那就什么时候用,什么时候来这里(w3schools)或这里(Character Entity Reference HTML 4)看吧,很详细而且比较权威。

原文地址:http://www.cnblogs.com/gudao119/archive/2010/01/05/1639447.html