HTML案例 • 【第2章图片和超链接练习；锚链接练习；预格式化标签练习】

最新推荐文章于 2022-07-20 05:00:00 发布

.冯上

最新推荐文章于 2022-07-20 05:00:00 发布

阅读量430

点赞数 2

分类专栏： HTML CSS学习进度文章标签： html

本文链接：https://blog.csdn.net/qq_51756226/article/details/110239710

版权

HTML CSS学习进度专栏收录该内容

5 篇文章 0 订阅

订阅专栏

全部章节 >>>>

练习一

<图片属性>

<!DOCTYPE html>
<html leng="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="keywords" content="d">
    <meta name="description" content="3">
    <title>图片标签</title>
</head>
<body>
<img width="300" height="200" alt="天空" title="蓝天" border="2" src="https://dss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3437217665,1564280326&fm=26&gp=0.jpg" alt="">
</body>
</html>

练习二

<指定链接目标>

<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <title>超链接标签</title>
</head>
<body>
<!--外部url-->
<a href="https://go.microsoft.com/fwlink/?LinkId=625115" target="_blank">MicrosoftEdge网页</a>
<!--内部url-->
<a href="day2_01.html" target="_blank">内部网页</a>
</body>
</html>

练习三

<用锚链接在网页内跳转>

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--标记18行-->
<a href="#18" id="top">第18行</a>

<p>第1行</p>
<p>第2行</p>
<p>第3行</p>
<p>第4行</p>
<p>第5行</p>
<p>第6行</p>
<p>第7行</p>
<p>第8行</p>
<p>第9行</p>
<p>第10行</p>
<p>第11行</p>
<p>第12行</p>
<p>第13行</p>
<p>第14行</p>
<p>第15行</p>
<p>第16行</p>
<p>第17行</p>
<!--18行-->
<p id="18">第18行</p>
<!--标记第1行代码-->
<a href="#top">返回顶部</a>
<p>第19行</p>
<p>第20行</p>
<p>第21行</p>
<p>第22行</p>
<p>第23行</p>
<p>第24行</p>
<p>第25行</p>
<p>第26行</p>
<p>第27行</p>
<p>第28行</p>
<p>第29行</p>
<p>第30行</p>
</body>
</html>

练习四

<预格式化标签>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<pre>
      鹅鹅鹅
    曲项向天歌
    白毛浮绿水
    红掌拨清波
</pre>
</body>
</html>

.冯上

关注

2
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
HTML案例 • 【第2章图片和超链接练习；锚链接练习；预格式化标签练习】

Day2学习进度练习一<图片属性><!DOCTYPE html><html leng="zh-cn"><head> <meta charset="UTF-8"> <meta name="keywords" content="d"> <meta name="description" content="3"> <title>图片标签</title><
复制链接

扫一扫