爬虫（一）：html学习

HTML 基本学习

HTML(Hyper text markup language) 是用来描述网页的一种语言，也叫做超文本标记语言。

HTML标签

  • 格式：

    <开始标签>标签内容</结束标签>

  • 举例：

    <p>这是一个p标签</p>

  • 说明：

    大部分标签都是成对出现的

    极少数是单个标签，比如<meta>

    <br> 换行，没有结束标签

元素

开始标签+标签中的内容+结束标签 就组成了元素

HTML元素： <开始标签>标签内容</结束标签>

HTML 中最常用的5大元素

开始标签 标签意义 结束标签
<h1> 一级标题 </h1>
<h2> 二级标题 </h2>
<a> 链接 </a>
<div> 块，用来包含其他标签 </div>
<p> 段落 </p>

HTML 基本结构

<head>元素就是网页头，<body>元素就是网页体。他们构成了HTML的基本结构

<html>
      <head>
             网页头的内容，这里的内容不会显示在网页里
      </head>
      <body>
             网页体的具体内容
      </body>
</html>
  • 头 <head>

首先<meta>标签定义了这个网页的编码格式。<title>元素就是用来设置这个网页的标题，会显示在浏览器的选项卡上.

<head>
    <meta charset="utf-8"> 
    <title>title标签里面包含的就是网页的名字</title>
</head>

HTML 属性

属性都在HTML的开始标签中设置，在结束标签中设置属性是不会生效的

属性的格式为：属性名 = “属性值”

举例： style = "color:#ff0000"
  • 常见属性
属性 知识点
class 为html元素设置类名
id 为html元素设置唯一的id
href 链接标签的url
style 定义元素的样式

  • style属性

    可以用来给文本类的标签定义样式，包括但不限于字体，字体颜色，字体大小，字体间距，文字对齐方式。

  • href 属性

    `<a>`标签的用途就是定义链接，搭配 **”href"** 属性，用来规定链接的URL。

 举例：`<a href = "https://www.tablesgenerator.com/markdown_tables"> markdown列表生成器</a>`

  • class 属性

点“.”代表了一个class。那么“.book”就代表了一个叫做“book”的“class”。在HTML中，“class”属性可以被多个不同的标签使用，我们在<head>的<style>中定义的“.book”样式，只要一个标签的 class = "book"，那么它都会继承这个样式。

<html>
   <head>
         <meta charset="utf-8"> 
         <title>title标签里面包含的就是网页的名字</title>
         <style>
         .book {
         /*以下是.book的具体样式规定*/
         float: left; /*控制元素浮动*/
         margin: 5px; /*外边距为5像素*/
         padding: 15px; /*内边距为15像素*/
         width: 300px; /*宽度为350像素*/
         height: 250px; /*高度为240像素*/
         border: 3px solid #ff0000; /*边框为3像素，颜色为ff0000*/
         }
         </style>
   </head>
   <body>
         h1 style="color:#ff0000;">书名</h1>
         <h3>作者</h3>
         <a href="https://xx.com" target="_blank">书的链接</a>
         <div class="book">
            <h2>唐吉可德</h2>
            <p>唐吉可德是一个什么什么人，讲述 什么什么故事
            </p>
         </div>
   </body>
</html>
  • id 属性

id属性和class属性的用法类似，它们的目的都是为了查找、定位元素，或者为元素设置样式。

id属性用于标识「唯一」的元素，而class用于标识「一系列」的元素。
“id”就像是学生的学生证号码，每个人都是唯一的，而学生们可以属于同一个班级，班级就
像class

常用文本格式tag

Tag Tag说明
<b> 粗体bold
<i> 斜体it alic
<del> 文字当中划线表示删除
<ins> 文字下划线表示删除
sub> 下标
<sup> 上标
blockquote> 缩进表示引用
<pre> 保留空格和换行
<code> 表示计算机代码，等宽字体
posted @ 2021-07-04 17:49  突然跳舞的咸鱼  阅读(107)  评论(0)    收藏  举报