爬虫准备 - 认识HTML&css

爬虫准备 - 认识HTML&css

爬虫之前除Python基础外还需要认识HTML与css。

网页的技术结构:HTML、css、JS

HTML(结构标准) — 提供网页内容(通过不同的标签提供不同的内容)

CSS(样式标准) — 负责网页内容的样式布局

JS(行为标准) — 负责控制网页变化

HTML

HTML — 超文本标记语言

一个网页就是一个HTML，HTML代码一般写在可以被浏览器直接解析的HTML文件中

​ 1)、HTML基本结构：一个HTML标签里面 包含一个head标签和一个body标签

​ HTML标签 — 代表整个页面

​ head — 网页顶部负责显示网页图标和标题部分(还负责不可见的设置性的内容)

​ body — 负责网页内容的显示

​ 2)、标签语法

​ HTML是通过不同的标签来提供不同的，标签从结构上分为两种：

​ a)、双标签 <标签名 属性1 = 属性值1 属性2 = 属性值2…>标签内容</标签名>

​ b)、<标签名 属性1 = 属性值1 属性2 = 属性值2…>、<标签名 属性1 = 属性值1 属性2 = 属性值2…/>

说明：
1)、标签名和’<‘与’>'之间不能存在空隙

​ 2)、属性值不管是什么类型的数据都必须用双引号引起来

​ 3)、双标的标签内容可以是任何内容:包括纯文字、也可以是一个或多个标签或者文字和标签的混合

​ 4)、标签名是HTML提供的

文本标签

标题标签

<h1>一级标题</h1>	
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>

段落标签

<p>《出师表》</p>
<p>先帝(1)创业(2)未半而中道(3)崩殂(4)，今(5)天下三分(6)，益州疲弊(7)，此(8)诚危急存亡之秋也。 然(9)侍卫之臣不懈于内，忠志之士忘身(10)于外者，盖追先帝之殊遇(11)，欲报之于陛下也。 诚宜（12）开张圣听，以光(13)先帝遗德，恢弘(15)志士之气，不宜妄自菲薄(16)，引喻失义(17)，以塞忠谏之路也(18)。 宫中府中，俱为一体(19)；陟罚臧否(20)，不宜异同：若有作奸犯科(21)及为忠善者(22)， 宜付有司(23)论其刑赏(24)，以昭陛下平明之理(25)；不宜偏私(26)，使内外异法也(27)。 侍中、侍郎郭攸之、费祎、董允等，此皆良实，志虑忠纯(28)，是以先帝简拔以遗陛下(29)： 愚以为宫中之事，事无大小，悉以咨之(30)，然后施行，必能裨补阙漏(31)，有所广益(32)。
</p>

行内标签

<span>行内文本1</span>
<label>行内文本2</label>
<font>行内文本3</font>

文字效果相关标签和符号

		<b>我被b标签加粗了</b>
		<strong>我被strong加粗了</strong>
		<!--倾斜：em-->
		<em>我在em标签里，所以我倾斜啦</em>
		<!--换行：br-->
		<br />
		<p>我头上有个br换行</p>
		<!--空格:&nbsp、&emsp-->
		&nbsp;&nbsp;
		<span>我前面有两个nbsp空格，它的单位是像素</span>&emsp;<span>我前面有一个emsp的空格
        	    他就是常规的空格
        </span>

div标签

1、作为普通双标签提供内容

2、作为一个盒子对网页中的内容进行分块分组

input标签

<!--普通输入框
        	value:输入框中的内容
        -->
        <input