前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >一、前端基础-html-img标签和a标签

一、前端基础-html-img标签和a标签

原创
作者头像
堕落飞鸟
发布2022-02-10 09:05:26
1.1K0
发布2022-02-10 09:05:26
举报
文章被收录于专栏:飞鸟的专栏
代码语言:javascript
复制
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<!-- img标签
1、图片引用
2、img有如下属性
    1、width设置宽度
    2、height设置高度
    3、alt图片加载失败时显示内容
    4、title图片title显示
-->
<img src="jiqimao.jpg" width="160px" height="220px" alt="图片加载失败" title="图片title">

<br/>
<!-- a标签
1、标签定义超链接,用于从一张页面链接到另一张页面。
    1、当前页面跳转
    2、新建页面跳转
2、元素最重要的属性是 href 属性,它指示链接的目标。
3、锚点
    1、锚点用于 页面内的跳转
    2、#后面的信息是id属性
-->
<a href="https://baidu.com">百度_当前页跳转</a>
<a href="https://baidu.com" target="_blank">百度_新建页面跳转</a>
<br/>

<a href="#1">锚点演示一</a>
<a href="#2">锚点演示二</a>
<a href="#3">锚点演示三</a>

<!-- 用于显示锚点定位的内容,增加高度背景色,方便演示 -->
<div id="1" style="height:600px;background-color: aqua">
    锚点一的内容
</div>
<div id="2" style="height: 600px;background-color: chartreuse">
    锚点二的内容
</div>
<div id="3" style="height: 600px;background-color: dimgrey">
    锚点三的内容
</div>

</body>
</html>

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档