HTML基础知识学习笔记

JD_Magi

于 2020-08-04 22:16:14 发布

阅读量127

点赞数

分类专栏：前端文章标签： html css js

本文链接：https://blog.csdn.net/weixin_44755735/article/details/107801720

版权

前端专栏收录该内容

5 篇文章 0 订阅

订阅专栏

HTML基础知识学习笔记

1、什么是HTML

超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建、描述网页的标准标记语言。

2、HTML有什么用

HTML 可以用来来建立自己的 WEB 站点，HTML 运行在浏览器上，由浏览器来解析

3、HTML的元素语法

HTML 元素以开始标签起始
HTML 元素以结束标签终止
元素的内容是开始标签与结束标签之间的内容
某些 HTML 元素具有空内容（empty content）
空元素在开始标签中进行关闭（以开始标签的结束而结束）
大多数 HTML 元素可拥有属性

4、HTML的使用

基本骨架

<!DOCTYPE html><!--声明为 HTML5 文档-->
<html><!-- 元素是 HTML 页面的根元素-->
<head><!--  元素包含了文档的元（meta）数据，如 <meta charset="utf-8"> 定义网页编码格式为 utf-8，一般也用来插入js，css脚本-->
<meta charset="utf-8">
<title>title</title><!--元素描述了文档的标题-->
</head>
<body><!--元素包含了可见的页面内容-->
    
</body>
</html>

常用标签

<!--------------------------------关于文本的标签------------------------------------->
<!--标题标签h1->h6-->
<h1>这是一个一级标题</h1>
<h2>这是一个二级标题</h2>
<h3>这是一个三级标题</h3>
<h4>这是一个四级标题</h4>
<h5>这是一个五级标题</h5>
<h6>这是一个六级标题</h6>

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

<!--段落标签-->
<p>这是一个段落。</p>
<p>这是另外一个段落。</p>

<!--换行标签-->
<br>

<!--文本格式化标签-->
<b>加粗文本</b>
<i>斜体文本</i>
<sub> 下标</sub>
<sup> 上标</sup>


<!-----------------------------引入外部资源的标签------------------------------------>

<!--链接标签-->
<a href="url">链接文本</a>
<a href="https://www.baidu.com">这是一个链接</a>
<!--链接标签的常用属性
target：
	* _blank:新页面跳转
	*_self:当前页面跳转（默认）
-->

<!--图像标签-->
<img src="/images/logo.png" width="258" height="39" />

<!----------------------------------表格标签--------------------------------------->
<table><!--定义一个表格-->
    <tr>
        <th>Header</th><!--定义表头-->
        <th>Header</th>
    </tr>
    <tr><!--定义一行-->
        <td>row 1</td><!--定义一行内的一列-->
        <td>row 1</td>
    </tr>
    <tr><!--第二行-->
        <td>row 2</td><!--第二行里的列-->
        <td>row 2</td>
    </tr>
</table>
<!----------------------------------列表标签--------------------------------------->
<!--无序列表-->
<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>
<!--有序列表-->
<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>
<!--自定义列表-->
<dl>
<dt>Coffee</dt>
<dd>- black hot drink</dd>
<dt>Milk</dt>
<dd>- white cold drink</dd>
</dl>

<!----------------------------------表单标签--------------------------------------->
<form><!--主要是和input标签搭配使用，input标签有很多属性可以完成相对应的表单操作-->
First name: <input type="text" name="firstname"><br>
Last name: <input type="text" name="lastname">
</form>

大多数HTML标签都有的属性

属性	描述
class	为html元素定义一个或多个类名（classname）(类名从样式文件引入)
id	定义元素的唯一id
style	规定元素的行内样式（inline style）
title	描述了元素的额外信息 (作为工具条使用)

head标签详解

head标签里常用的标签

<head>
  <base href="url" target="_blank">  <!--该标签作为HTML文档中所有的链接标签的默认链接-->
  <link rel="stylesheet" type="text/css" href="mystyle.css"><!--引入外部资源-->
  <script></script><!--编写js代码、引入外部js代码-->
  <style></style><!--编写css代码、引入外部css代码-->
</head>

HTML中的区块元素

HTML 可以通过==

== 和 == ==将元素组合起来。

块级元素：占一行的，不会在下一行开始

区级元素:占多行，，会以下一行开始

HTML 分组标签（本身并无特定的含义，可用作文本的容器）

标签
div 定义了文档的区域，块级 (block-level)
span 用来组合文档中的行内元素，内联元素(inline)

标签
div	定义了文档的区域，块级 (block-level)
span	用来组合文档中的行内元素，内联元素(inline)

JD_Magi

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML基础知识学习笔记

HTML基础知识学习笔记1、什么是HTML超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建、描述网页的标准标记语言。2、HTML有什么用HTML 可以用来来建立自己的 WEB 站点，HTML 运行在浏览器上，由浏览器来解析3、HTML的元素语法HTML 元素以开始标签起始HTML 元素以结束标签终止元素的内容是开始标签与结束标签之间的内容某些 HTML 元素具有空内容（empty content）空元素在开始标签中进行关闭（以开始
复制链接

扫一扫