HTML文字效果

文字的大小、颜色和字体

<font>标签用于设置文本的字体、大小和颜色

  1. 字体大小:HTML文件可以有7种字号,1号最小,7号最大。默认字号为3,可以用<font size=字号>设置绝对字号;另一种是设置文本的相对字号,即使用标志<font size=±n>。“+”号表示字号变大,“-”号表示字号变小。

  2. 文字颜色:文字的颜色可以用<font color="#rrggbb">指定,以下列出了网页中的16中标准颜色。

    色彩名十六进制值色彩名十六进制值
    Aqua(水蓝色)#00FFFFNavy(藏青色)#000080
    Black(黑色)#000000Olive(茶青色)#808000
    Blue(蓝色)#0000FFPurple(紫色)#80080
    Fuchsia(樱桃色)#FF00FFRed(红色)#FF0000
    Green(绿色)#00FF00Silver(银色)#C0C0C0
    Gray(灰色)#808080Teal(茶色)#008080
    Linen(亚麻色)#FAF0E6White(白色)#FFFFFF
    Maroon(褐红色)#800000Yellow(黄色)#FFFF00
  3. 文字字体:文字字体可以用<font face="字体名称1,字体名称2">指定。face属性的值可以有1个或多个,即可以设置多个字体。首选第一种字体显示,在第1种字体不存在时使用第2种字体显示,以此类推。


文字风格标识符

标识符功能标识符功能
<b></b>粗体<small></small>较小
<big></big>大字体<sub></sub>下标
<i></i>斜体<sup></sup>上标
<s></s>删除线<tt></tt>固定宽度字体
<code></code>等宽效果<u></u>下划线
<strong></strong>特别强调、粗体<em></em>强调、斜体

边框包围的文字

通过标记定义文字的边框

<html>
    <head><title>图像的大小的边框</title></head>
    <body>
        <fieldset>
            <font>增加了边框的文字</font>
        </fieldset>
    </body>
</html>

显示效果:

在这里插描述


练习一

制作一个“中国成语解释”网页,该网页在浏览器中显示几句著名的成语,当鼠标指针移到成语文字之上时,会显示该成语的解释。

<html>
<head><title>中国成语解释</title></head>
    <body bgcolor="White">
        <h1 align="center">中国成语解释</h1>
        <p><font size="4" color="gray"><b>下面介绍几句著名的成语,把鼠标移到成语文字之上,可以看到该成语的解释。</b></font></p>
        <p title="比喻话的说法不一而用意相同,或一件事情的做法不同而都巧妙地达到目的。">1.异曲同工</p>
        <p title="比喻敌人准备进攻或坏人阴谋捣乱。">2.蠢蠢欲动</p>
        <p title="比喻能够轻而易举地办成某件事情。">3.探囊取物</p>
        <p title="出乎人们意料之外。">4.出人意表</p>
        <p title="犹言乐极生悲。欢乐到了极点,将转而发生悲伤的事。">5.乐尽悲来</p>
        <p title="表示极为悲伤或悲愤。">6.捶胸跌足</p>
        <p title="傍晚的云,春天的树。表示对远方友人的思念。">7.暮云春树</p>
    </body>
</html>

效果如图

  • 1
    点赞
  • 28
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值