HTML学习笔记

最新推荐文章于 2024-10-04 06:11:34 发布

桃花喂山风

最新推荐文章于 2024-10-04 06:11:34 发布

阅读量110

点赞数 1

文章标签： html html5 爬虫

本文链接：https://blog.csdn.net/weixin_46080344/article/details/119809672

版权

最近学习了前端HTML的相关知识（之前也有学过），再次做一下笔记总结。

首先，HTML是一门超文本标记语言，“超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素，HTML是构建Web页面的基本元素，也是一种规范，一种标准。

HTML特点：

1.简易性：超文本标记语言版本升级采用超集方式，从而更加灵活方便。

2.可扩展性：超文本标记语言的广泛应用带来了加强功能，增加标识符等要求，超文本标记语言采取子类元素的方式，为系统扩展带来保证。

3.平台无关性：虽然个人计算机大行其道，但使用MAC等其他机器的大有人在，超文本标记语言可以使用在广泛的平台上，这也是万维网（WWW）盛行的另一个原因。

4.通用性：另外，HTML是网络的通用语言，一种简单、通用的全置标记语言。它允许网页制作人建立文本与图片相结合的复杂页面，这些页面可以被网上任何其他人浏览到，无论使用的是什么类型的电脑或浏览器。

<html>标签

整个网页是从<html>这里开始的，然后到</html>结束。

<head>的内部标签及其解释

head内部标签主要用于设置或者导入外部文件，一般不直接显示在浏览器视口中

表1 <head>内部标签

<title>	定义网页的标题
<meta>	定义网页的基本信息（供搜索引擎）
<style>	定义CSS样式
<link>	链接外部CSS文件或脚本文件
<script>	定义脚本语言

<body>标签

表示html的体部，其内部主要放网页内容，其内容会显示到浏览器视口中，所有想要显示在浏览器中的元素都被包含在该元素中。

HTML中的语法

注释

html中只有一种注释，即 ，主要用于帮助编程人员记录编程思路，解释说明业务功能。

标签元素

单标签元素，仅有一个标签如<meta /> 、<img />、<br/>

双标签元素，由开始标签和结束标签组成 <div></div>、<p></p>

常见的标签内的属性

属性	含义	示例
title	描述信息	<div title="div1">div1</div>
id	唯一标识	<div id="div1">div1</div>
class	标识一类元素	<div class="box1">box1</div>
style	样式	<div style="color: red;">我是一个div</div>

块级元素

作用：搭建网页结构

特点：

独占一行空间

默认宽度为100%

高度由子元素或内容决定

也可以通过CSS指定高度

块级可以包含块级和行内元素

元素：html、body、div、p、h1~h6、ul->li、ol->li、dl->dd/dt、header、footer、nav、article、section、aside、address...

建议：不要将块级元素嵌套在行内元素中。

行内元素

作用：在结构中填充网页内容

特点：

与其他行内元素共享一行空间

宽高由自身内容决定

由于不用来搭建网页结构，所以也无需通过css指定其宽度

行内元素中不可以嵌套块元素

元素：span、a、img、strong、b、i、em、sub、sup...

块级元素和行内元素的区别

        1.经典：块级元素独占一行，行内元素与其他元素共享一行
        2.宽高：块级默认宽度100% 可以直接设置宽高，行内不可以设置宽高（需要通过display改变元素属性才可以设置）行内元素宽高由内容决定（img,input 特殊的行内元素）
        3.块级元素可以包含块级元素和行内元素行内元素只能包含行内元素

以上就是对HTML中基本的一下标签和元素的笔记总结。