HTML:标题,标签

标题:

<h1></<h1>

<h2></h2>

<h3></h3>

<h4></h4>

.....

越往下,其标题越小

代码演示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>标题</title>
</head>
<body>
<h1>你好!</h1>
<h2>你好!</h2>
<h3>你好!</h3>
<h4>你好!</h4>
<h5>你好!</h5>
<h6>你好!</h6>
</body>
</html>

结果:

段落:

<p></p>

代码演示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>段落</title>
</head>
<body>
<p>你好!</p>
<p>你好!</p>
<p>你好!</p>
</body>
</html>

结果:

横线:

<hr>

在<hr>里面去设置你想要的长度,宽度,颜色。

代码演示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>横线</title>
</head>
<body>
<hr width="500px" color="red">
</body>
</html>

结果:

链接:

<a href="">

href是指链接的地址。

代码演示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>链接</title>
</head>
<body>
<a href="upload.html">跳转</a>
</body>
</html>

结果:

点此跳转就可以去你所链接的页面。

图片链接:

<img src="">

图片的名称和尺寸是以属性的形式提供的。

代码演示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>链接</title>
</head>
<body>
<img src="img/24.jpg" width="500px" height="300px">
</body>
</html>

结果:

强制换行:

<br>标签

文本内标签:

<span></span>

有序列表:

start:开始的数字

type:序号方式

<ol></ol>

列表项:

<li></li>

代码演示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>有序列表</title>
</head>
<body>
<ol start="1"type="1">
    <li>苹果</li>
    <li>西瓜</li>
    <li>香蕉</li>
    <li>小香菇</li>
</ol>
</body>
</html>

结果:

 

无序列表:

<ul></ul>

代码演示:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>无序列表</title>
</head>
<body>
<ul type="square">
    <li>苹果</li>
    <li>西瓜</li>
    <li>香蕉</li>
    <li>小香菇</li>
</ul>
</body>
</html>

结果:

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值