2021-09-16

这篇博客介绍了HTML的基本概念,如超文本标记语言和W3C标准,并展示了HTML的基本结构,包括头部和主体元素,如标题、段落、换行、粗体和斜体等。还涵盖了图像和链接标签的使用,以及如何创建邮件和QQ链接。
摘要由CSDN通过智能技术生成

HTML(一)

  • HTMl

Hyper Text Markup Language (超文本标记语言)

  • W3C

World Wide Web Consortium (万维网联盟)

  • W3C标准包括

结构化标准语言(HTML,XML)

表现标准语言 (CSS)

行为标准 (DOM,ECMAScripts)

<!-- 注释标签 -->
<!-- ctrl+/ :生成注释标签 -->
<!-- DOCTYPE:告诉浏览器我们要使用什么规范 -->
<!DOCTYPE html>

<html lang="en">
<!-- head表示网页的头部 -->
<head>
<!-- meta描述性标签,它用来描述我们网站的一些信息 -->
<!-- meta一般用来做SEO(搜索引擎)-->
    <meta charset="UTF-8">
    <meta name="keywords" content="落客">
    <meta name="description" content="w外野">
<!-- title 网页标题-->
    <title>Title</title>
</head>
<!-- body表示标签代表网页主体 -->
<body>
Hello! world
</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>
<h6>六级标签</h6>
<!--水平线标签-->
<hr>
比较多v控制块v        就不知道女生离开你
二v的麦克风v    疯狂肯为
<hr>
<!--段落标签-->
<p>v觉得v科技呃呃v分v发个表格发v</p>
<p>v不被认可发感慨万分让各位法国</p>
<!--换行标签-->
<hr>
比较多v控制块v        就不知道女生离开你<br/>
二v的麦克风v    疯狂肯为
<br>
<hr>
<!--粗体-->
<strong>粗体:人生路人</strong>
<hr>
<br>
<!--斜体-->
<hr>
<em>斜体:情感导师</em>
<hr>
<!--特殊符号-->
空格
<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br>
大于号
&gt;
小于号
&lt;
<br>
版权符号
&copy;所有人
<!--
特殊符号记忆方式

&  ;
-->
&RBarr;
</body>
</html>

常见的图像格式

  1. JPG
  2. GIF
  3. PNG
  4. BMP

<img src="path" alt="text"     title="text"    width="x" height="y"/>
     图像地址     图像的替代文字  鼠标悬停提示文字  图像宽度   图像高度

链接标签

<a href="path" target="目标窗口位置" >链接文本或图像</a>
   链接路径      链接在那个窗口打开  常用:_self, _blank
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>链接标签学习</title>
</head>
<body>
<!--使用name作为标记用来跳-->
<a name="top">顶部</a>
<!-- a标签 -->
<!--
href :必填,表示要跳转到那个页面
target :表示在那个窗口打开
_blank

-->
<a href="1.我的第一个网页" target="_blank">点击我跳转到页面</a>
<a href="https://www.baidu.com">点击我跳转到百度</a>
</br>
<a href="1.我的第一个网页">
    <img src="../resources/image/4.jpg" alt="刀刃" title="悬停文字" height="300" width="300">
</a>
<!--
锚链接
1.需要一个锚标记
2.跳转到标记 用#号表示

-->
<a href="#top">回到顶部</a>
<a href="second.html#down">跳转</a>
<!--
功能性链接
邮件链接 :mailto
QQ链接

-->
<a href="mailto:349174425@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::53" alt="别无聊" title="别无聊"/>
</a>
</body>
</html>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值