前端基础学习

最新推荐文章于 2024-07-30 16:49:30 发布

Shrek102930

最新推荐文章于 2024-07-30 16:49:30 发布

阅读量90

点赞数

文章标签：前端

本文链接：https://blog.csdn.net/Shrek102930/article/details/120981562

版权

文章目录

初识HTML

初识HTML

在这里插入图片描述

基础结构


<!-- DOCTYPE:告诉浏览器，我们要使用什么规范 -->
<!DOCTYPE html>

<html lang="en">

<!-- head标签代表网页头部 -->
<head>
<!-- meta描述性标签，他用来描述我们网站的一些信息-->
<!-- meta一般用来做SEO（搜索引擎优化）-->
    <meta charset="UTF-8">
    <meta name="keywords" content="我的网站">

<!-- title网页标题 -->
    <title>Title</title>
</head>

<!-- body标签代表网页主体 -->
<body>


你好！

</body>

</html>

网络基本标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基本标签学习</title>
</head>
<body>

<!--标题标签-->
<h1>一级标签</h1>
<h2>二级标签</h2>
<h3>三级标签</h3>
<h4>四级标签</h4>
<h5>五级标签</h5>

<!--段落标签-->
<P>afafaagag fwafaw</P>
<P>fwaggag fawfafwa</P>
<p>gegega awfawfa</p>

<!--水平线标签-->
<hr/>

<!--换行标签-->
afafafawfawf<br/>  fafawfawfwaf<br/>

<!--粗体，斜体-->

<strong>love</strong>
  <em>love</em>


空格&nbsp;&nbsp;空格

<br/>
&gt;
<br/>
&lt;
&copy;版权符号





</body>
</html>

图像标签

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>图像标签学习</title>
</head>
<body>
<!--img学习
src:图片地址
相对地址(推荐使用)，绝对地址
   ../   表示上一级目录

-->

<img src="../resource/image/头像.jpg" alt="图片加载显示失败文字" title="悬停文字" width="676" height="676" >




</body>
</html>

链接标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>链接标签学习</title>
</head>
<body>

<!--使用name来做标记-->
<a href="top">顶部</a>
<br>

<!--a标签
href:必填，表示要跳转到那个页面
target:表示窗口在哪里打开
_blank  在新标签中打开
_self   在本页面打开
-->


<a href="1.基本标签.html" target="_blank">点击我跳转到页面一</a>
<br>
<a href="https://www.baidu.com" target="_self">点击我跳转到百度</a>
<br>
<a href="https://www.baidu.com">点击我跳转到百度</a>

<br>

  <p><a href="https://www.baidu.com"><img src="../resource/image/头像.jpg" alt="加载失败文字" title="悬停文字"></a></p>
  <p><a href="https://www.baidu.com"><img src="../resource/image/头像.jpg" alt="加载失败文字" title="悬停文字"></a></p>

<br>

<!--锚链接
1.需要一个锚标记   <a href="top">顶部</a>
2.跳转到该标记  <a href="#top">回到顶部</a>
-->
<a href="#top">回到顶部</a>

<br>

<!--功能性链接
邮件链接：mailto
-->





<a href="mailto:shrek102930@qq.com">点击联系</a>

<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=&site=qq&menu=yes">
  <img border="0" src="http://wpa.qq.com/pa?p=2:2235663513:51" alt="点击这里给我发消息" title="点击这里给我发消息"/></a>

</body>
</html>

Shrek102930

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
前端基础学习

文章目录初识HTML基础结构网络基本标签图像标签链接标签初识HTML基础结构<!DOCTYPE html><html lang="en"><head> <meta
复制链接

扫一扫