HTML入门基础(007)

今天我们接着说文本格式化标签。

 

删除线标签<s>:

如果想要在网页中,表达一个文本或者数字,被删除了,但是又需要能够看到删除的内容,就可以用删除线标签符。

 

<html>  <head>    <title>删除线标签</title>  </head>  <body>    <p>八戒西瓜:</p>    <p>原价:<s>¥5.50</s>/KG</p>    <P>现价:<strong>¥4.80</strong></P>  </body></html>

 

在实际开发中,删除线效果常见于商品价格上,一般不使用删除线<s>,而是更多的使用CSS样式表来处理。

 

下划线标签符<u>:

对网页中的文本实现下划线效果,可以使用此标签符,示例代码如下:

​​​​​​​

<html>  <head>    <title>下划线标签</title>  </head>  <body>    <p>问:你的出生日期是?</p>    <p>答:我是<u>2000年1月1日</u>出生的。</p>    <p>问:你为什么要学习HTML?</p>    <p>答:我是为了<u>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</u>。</p>  </body></html>

 

在实际开发中,对文本实现下划线效果,也一般是使用CSS样式表来完成的。在代码中出现了(&nbsp;)符号,这个符号在HTML语言表示的是空格的意思;有很多时候,我们需要在代码中表示空格,但是在代码之间敲打了很多空格,调试网页时发现没有得到预期效果,所以用具体的符号来指代空格。

 

水平线标签符<hr>:

在网页中,有时候我们需要用一根直线来分隔一些内容,起到醒目的作用,就可以使用水平线标签符,示例代码如下:

​​​​​​​

<html>  <head>    <title>水平线标签</title>  </head>  <body>    <h2>古诗三百首</h2>    <hr>    <h3>静夜思</h3>    <p>床前明月光,疑是地上霜。</p>    <p>举头望明月,低头思故乡。</p>    <br>    <h3>春晓</h3>    <p>春眠不觉晓,处处闻啼鸟。</p>    <p>夜来风雨声,花落知多少。</p>    <hr>  </body></html>

 

水平线标签符,它是一个自闭合标签,可以写成<hr>,也可以写成<hr/>,但是不用成对出现。

 

分区标签符<div>:

在HTML文档中,<div>标签符主要是对大块的内容提供一个结构或者说是容器,然后使用CSS样式表对这个分区进行显示上的各种样式的配置,我们能够看到很多的HTML教程都直接说学习“div + css”,就是指的这个。

​​​​​​​

<html>  <head>    <title>分区标签符</title>  </head>  <body>    <!-- 这是注释,不显示在网页上,第一首诗 -->    <div>      <h3>静夜思</h3>      <p>床前明月光,疑是地上霜。</p>      <p>举头望明月,低头思故乡。</p>    </div>    <hr>     <!-- 这是注释,不显示在网页上,第二首诗 -->    <div>      <h3>春晓</h3>      <p>春眠不觉晓,处处闻啼鸟。<p>      <p>夜来风雨声,花落知多少。</p>    </div>  </body></html>

 

从网页的效果上来看,其实看不出分区标签的作用,这个只有到学习CSS样式表后,才会体验到div + css,可以让网页的内容精彩起来的。

 

另外插一句,我们在代码中看到了<!-- -->这样的代码,它的作用是注释,很多时候我们需要对编写的代码进行一些说明,但是同时又不希望让用户看到,就可以使用注释语句,将注释的内容放在中间。这种注释方式只适合HTML语言,其他代码的注释有其他方式,以后会给大家分享的。

 

下一节,我们分享关于特殊符号的内容。

 

 

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

虾米大王

有你的支持,我会更有动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值