摘要:标签不区分大小写,但推荐小写。标签可以嵌套,但不能交叉嵌套。标签也称为元素。比如行内标签亦可成行内元素。
?
??直接跳到末尾?? ——>领取专属粉丝福利?
☝️
?上一篇博文两万字博文教你python爬虫requests库,看完还不会我把我女朋友都给你【❤️熬夜整理&建议收藏❤️】被众多爬虫爱好者/想要学习爬虫的小伙伴们阅读之后,很多小伙伴私信我说——爬是会爬了,但是爬下来的都是网页源码数据,真心看不懂鸭!该怎么办??
?(苦笑)为了能让小伙伴们对日后所学的页面解析库理解更深,所以本博主又连夜加班加点,苦苦熬制本文(分上下两篇哦!),为大家深入全面的讲解一下常见的前端知识——学啥技术都是从底层抓起,万丈高楼平地起,它也是基于地基稳! 所以本文(共分上下两篇哦!)是比页面解析库要先一步总结给小伙伴们哦!?
?在这两篇博文中,本博主就带领小伙伴们认真地学习一下HTML(超文本标记语言)相关的必备知识(爬虫爬到数据之后解析页面数据你得多少能看懂页面结构!)——HTML是一门标记语言,标记语言由一套标记标签组成,学习HTML,就是学习标签。!?
相信有不少小伙伴已经通过我的上篇博文完全地学费了requests库,而本篇(以及下篇)文讲解的HTML知识,将会使你日后解析爬取到的页面数据信手拈来哦~
知识点补给站: |
如果把网页比作一个人的话,HTML相当于骨架,JavaScript相当于肌肉,CSS相当于皮肤。三者结合起来才能形成一个完善的网页。首先要普及的一个概念是一个网页组成部分: ①HTML:用于定义网页里面有什么内容; ②CSS:对内容进行排版; (1)找到要排版的内容————如何找到要排版的标签; (2)设置样式————标签都能设置哪些样式。 ③JavaScript:用于动态的控制页面。
HTML:(HyperText Markup Language)【超文本标记语言】
狭义的HTML指的是网页;
广义的HTML指的是前端技术(html,css,js,以及各种框架)——网页,移动端网页,小程序,公众号,移动端的app,快应用等。
详细介绍:
HypertText:超文本——超出文本的范畴,简单地说,不仅仅是文本,还可以是图像,音频,视频,flash等等;
Markup:标记——网页中会有很多标记,不同的标记有不同的含义和功能,标记也叫标签,Html会包含各种各样的标签,这些标签不能乱写,必须写w3c规范中包含的标签。
标签的举例:
① -- 双标签
②
-- 单标签
HTML是一门标记语言,标记语言由一套标记标签组成,学习HTML,就是学习标签。
编辑器:pycharm(搞python的肯定得用pycharm!)
浏览器:Firefox,Chrome(建议使用这俩哦!)
如果你再pycharm里新建一个html文件就会像下面这样!
<!DOCTYPE html> #文档类型的声明"en"> #根标签,即文档的开始。 lang(language),en(english)。声明语言类型是英语 #网页头部 "UTF-8"> #国际编码 meta配置 字符集编码的类型 Title<<span class="token operator">/</span>title> <span class="token comment">#网页标题</span><<span class="token operator">/</span>head><body> <span class="token comment">#网页的主体,可视化区域</span><<span class="token operator">/</span>body><<span class="token operator">/</span>html></code></pre> <p><font color="Blue">知识点补给站:</font></p> <ol><li><code><!DOCTYPE html> 标签:作用:在html文件最前面进行声明,定义文档类型,告知浏览器用html规范去解析文档。</code></li><li><code>在pycharm中编写HTML文件时,<!-- 要注释的内容--> 为注释,快捷键是Ctrl+/。</code></li><li><code>在pycharm中编写HTML文件时,打标签时可直接打标签名,再Tab即可实现自动补全。 如:输入p,再Tab会自动补全为:<p></p></code></li></ol> <p></p> <h1><a id="_127"></a>第二部分:标签</h1> <ol><li>什么是标签?</li></ol> <pre><code class="prism language-html"> 由尖括号包裹单词构成,如:<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>html</span><span class="token punctuation">></span></span>,所以标签不可能以数字开头。</code></pre> <ol start="2"><li>标签不区分大小写,但推荐小写。</li><li>标签可以嵌套,但不能交叉嵌套。</li><li>标签也称为元素。比如:行内标签亦可成行内元素。</li></ol> <pre><code class="prism language-powershell">错误示例:<a><b><<span class="token operator">/</span>a><<span class="token operator">/</span>b>正确示例:<a><b><<span class="token operator">/</span>b><<span class="token operator">/</span>a></code></pre> <p></p> <h2><a id="1_144"></a>1.标签的使用样式及属性</h2> <h3><a id="1_145"></a>(1)标签的使用样式:</h3> <ol><li><code>开始标签又称开放标签<a>标签体</a>结束标签又称闭合标签或关标签</code></li><li><code>自闭合标签/单标签,如:<meta charset="UTF-8">,<br>等</code></li></ol> <pre><code class="prism language-html"> 单标签有两种写法: 写法一:只写开标签即可<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>br</span><span class="token punctuation">></span></span> 写法二:在开标签的结尾写一个/,如<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>br</span><span class="token punctuation">/></span></span></code></pre> <h3><a id="2_156"></a>(2)标签属性:</h3> <ul><li><code>通常为键值对形式出现,比如:<meta charset="UTF-8"> 里面的charset为标签的属性,对应的单引号或者双引号里的称为属性值;</code></li><li>属性只能出现在开始标签和自闭合标签内,但不能出现在结束标签里;</li><li>属性名字全部小写,属性值必须用单引号或者双引号包裹;</li><li>如果属性名和属性值完全一样,直接写属性名即可,如:“readonly”(input标签属性)</li></ul> <p></p> <h3><a id="3_165"></a>(3)块状标签</h3> <p></p> <h4><a id="_168"></a>第一部分知识点——块状标签的特点:</h4> <pre><code class="prism language-python"><span class="token operator"><</span>!DOCTYPE html<span class="token operator">></span><span class="token operator"><</span>html lang<span class="token operator">=</span><span class="token string">"en"</span><span class="token operator">></span><span class="token operator"><</span>head<span class="token operator">></span> <span class="token operator"><</span>meta charset<span class="token operator">=</span><span class="token string">"UTF-8"</span><span class="token operator">></span> <span class="token operator"><</span>title<span class="token operator">></span>块状标签的特点<span class="token operator"><</span><span class="token operator">/</span>title<span class="token operator">></span><span class="token operator"><</span><span class="token operator">/</span>head<span class="token operator">></span><span class="token operator"><</span>body<span class="token operator">></span> <span class="token operator"><</span>!<span class="token operator">-</span><span class="token operator">-</span>块状标签的特点<span class="token punctuation">:</span><span class="token punctuation">(</span>通过段落标签p进行说明<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">-</span><span class="token operator">></span> <span class="token operator"><</span>!<span class="token operator">-</span><span class="token operator">-</span><span class="token number">1</span><span class="token punctuation">.</span>设置宽高有效,以及外边距和内边距都可控制<span class="token operator">-</span><span class="token operator">-</span><span class="token operator">></span> <span class="token operator"><</span>!<span class="token operator">-</span><span class="token operator">-</span><span class="token number">2</span><span class="token punctuation">.</span>在不设置宽度的情况下,宽度始终与父标签保持一致,与内容无关。是父标签容器的<span class="token number">100</span><span class="token operator">%</span>;<span class="token operator">-</span><span class="token operator">-</span><span class="token operator">></span> <span class="token operator"><</span>!<span class="token operator">-</span><span class="token operator">-</span><span class="token number">3</span><span class="token punctuation">.</span>可以独占一行,实现自动换行。一个段落标签不管多少内容都占一行<span class="token operator">-</span><span class="token operator">-</span><span class="token operator">></span> <span class="token operator"><</span>!<span class="token operator">-</span><span class="token operator">-</span><span class="token number">4</span><span class="token punctuation">.</span>当多个块状标签写一起时,默认排列方式是从上向下<span class="token operator">-</span><span class="token operator">-</span><span class="token operator">></span> <span class="token operator"><</span>!<span class="token operator">-</span><span class="token operator">-</span><span class="token number">5</span><span class="token punctuation">.</span>可以容纳内联元素和其他块元素<span class="token operator">-</span><span class="token operator">-</span><span class="token operator">></span> <span class="token operator"><</span>p style<span class="token operator">=</span><span class="token string">"width:100px; height:100px"</span><span class="token operator">></span>这是个段落标签,我是块状标签<span class="token operator"><</span><span class="token operator">/</span>p<span class="token operator">></span><span class="token operator"><</span><span class="token operator">/</span>body<span class="token operator">></span><span class="token operator"><</span><span class="token operator">/</span>html<span class="token operator">></span></code></pre> <table><tbody><tr><td bgcolor="yellow">知识点补给站: 1.px是像素,是长度单位; 2.在网页查看元素(ELements)显示的是宽度*高度。</td></tr></tbody></table> <h4><a id="_195"></a>第二部分知识点——常用的块状标签:</h4> <p><font color="#008000">小知识点:网页的默认字号是1em(1em=16px)!</font></p> <p>总共有四个:</p> <ol><li>标题标签;</li></ol> <pre><code class="prism language-html"> <span class="token comment"><!--第一个:标题标签。h1到h6 (一般放在文章的标题) 字体会加粗!--></span> <span class="token comment"><!-- h1字号是2em--32px;h2字号是1.5em--24px;h3字号是1.17em--18.72px;h4字号是默认字号16px; h5字号是0.83em--13.28px;h6字号是0.67em--换算应该是10.72px,但是网页有最小字号限制,所以会变为12px! --></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>h1</span><span class="token punctuation">></span></span>我是一级标签,一个网页只能有一个,别的可以有多个<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>h1</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>h2</span><span class="token punctuation">></span></span>我是二级标签<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>h2</span><span class="token punctuation">></span></span></code></pre> <ol start="2"><li>段落标签;</li></ol> <pre><code class="prism language-html"> <span class="token comment"><!--第二个:段落标签。 大小跟四级标题标签一样 (会把HTML文档分割成若干个段落)--></span> <span class="token comment"><!-- p标签默认有段前段后间距--16px;但是段落标签并不会首行缩进! --></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>我是段落标签<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span></code></pre> <ol start="3"><li>列表标签:分为有序列表,无序列表和定义列表三大类;</li></ol> <pre><code class="prism language-html"> <span class="token comment"><!--第三个:列表标签--></span> <span class="token comment"><!--(1)有序列表--></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>ol</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>A<span class="token punctuation">"</span></span> <span class="token attr-name">start</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token comment"><!--ol是order list的缩写。本行是有序列表的开始 type有五个选择——1:按1,2,3,4...显示序号(默认); A:按A,B,C,D..显示序号; a:按a,b,c,d..显示序号; I:按I,II,III,IV,V..显示序号(罗马数字); i:按i,ii,iii,iv,v..显示序号(罗马数字小写)。 start规定从第几个开始排--></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>li</span><span class="token punctuation">></span></span>这是有序列表1<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>li</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>li</span><span class="token punctuation">></span></span>这是有序列表2<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>li</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>li</span><span class="token punctuation">></span></span>这是有序列表3<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>li</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>ol</span><span class="token punctuation">></span></span> <span class="token comment"><!--(2)无序列表--></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>ul</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>circle<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token comment"><!--ul是unorder list的缩写。本行是无序列表的开始 可以设置none(空的),circle(空心圆),square(实心方块),disc(实心圆)[默认值]等样式--></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>li</span><span class="token punctuation">></span></span>这是无序列表1<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>li</span><span class="token punctuation">></span></span> <span class="token comment"><!-- 一个li代表一个列表项。 --></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>li</span><span class="token punctuation">></span></span>这是无序列表2<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>li</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>li</span><span class="token punctuation">></span></span>这是无序列表3<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>li</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>li</span><span class="token punctuation">></span></span>这是无序列表4<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>li</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>ul</span><span class="token punctuation">></span></span> <span class="token comment"><!--(3)定义列表--></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>dl</span><span class="token punctuation">></span></span> <span class="token comment"><!--本行是定义列表的开始--></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>dt</span><span class="token punctuation">></span></span>水果<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>dt</span><span class="token punctuation">></span></span> <span class="token comment"><!--代表一个大的列项--></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>dd</span><span class="token punctuation">></span></span>葡萄<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>dd</span><span class="token punctuation">></span></span> <span class="token comment"><!--代表对上面列项的解释,即细分。--></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>dd</span><span class="token punctuation">></span></span>榴莲<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>dd</span><span class="token punctuation">></span></span> <span class="token comment"><!-- dd有缩进,dt没有缩进 --></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>dt</span><span class="token punctuation">></span></span>蔬菜<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>dt</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>dd</span><span class="token punctuation">></span></span>花菜<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>dd</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>dd</span><span class="token punctuation">></span></span>包菜<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>dd</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>dl</span><span class="token punctuation">></span></span></code></pre> <ol start="4"><li>div标签。</li></ol> <pre><code class="prism language-html"> <span class="token comment"><!--第四个:div标签:用来分划一个一个的区域 (width和height来规定区域大小;background-color是设置区域背景色)--></span> <span class="token comment"><!--div是一个纯净的块元素——所谓纯净意思是没有任何的默认样式。不宜过多使用。后期维护不好--></span> <span class="token comment"><!-- div最大的优势:布局,作为容器,承载其他标签,因为div没有默认样式,所以尽管用div包裹了标签, 但不影响标签的展示。 --></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token style-attr"><span class="token attr-name">style</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token style language-css"><span class="token property">width</span><span class="token punctuation">:</span>500px<span class="token punctuation">;</span><span class="token property">height</span><span class="token punctuation">:</span> 500px<span class="token punctuation">;</span><span class="token property">background-color</span><span class="token punctuation">:</span> #66a9fe<span class="token punctuation">;</span></span><span class="token punctuation">"</span></span></span><span class="token punctuation">></span></span>我是一个div<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span></code></pre> <table><tbody><tr><td bgcolor="yellow">知识点补给站:</td></tr></tbody></table> <p> 如果嫌打列表标签太麻烦,可使用快捷方法:(n表示相应的标签的个数,直接输入下面语句Tab一下即可生成!)<br /> </p> <h4><a id="font_colorredemmetfont_273"></a>深入讲解:<font color="red">emmet语法</font>————快速敲代码小技巧之快速敲标签语法!</h4> <ol><li> <p><code>*是乘的作用,后面跟一个数字,数字是几,就会生成几个标签!</code><br /> 举例:<br /> <br /> 实现:<br /> </p> </li><li> <p><code>$可以代表一个数字,这个数字从1开始,逐步增大,通常和*连用。</code><br /> 举例:<br /> <br /> 实现:<br /> </p> </li><li> <p><code>{}里面用于书写标签的文本内容。</code><br /> 举例:<br /> <br /> 实现:<br /> </p> </li><li> <p><code>[]里面用于书写属性名和属性值(如果不加属性值,则创建属性值为空的属性)</code><br /> 举例①:<br /> <br /> 举例②:<br /> </p> <p>实现①:<br /> <br /> 实现②:<br /> </p> </li><li> <p><code>>用于指示下一级标签,他们构成父子关系(包含关系)</code><br /> 举例:<br /> </p> <p>说明:<br /> </p> </li><li> <p><code>+在当前标签的后面生成一个平级的标签(兄弟关系)</code><br /> 举例:<br /> <br /> 实现:<br /> </p> </li><li> <p><code>#a生成一个id位a的div标签</code></p> <p>举例:<br /> <br /> 实现:<br /> </p> </li><li> <p>综合使用:<br /> 举例①:<br /> </p> <p>实现①:<br /> <br /> 举例②:<br /> <br /> 实现②:<br /> <br /> 举例③:<br /> <br /> 实现③:<br /> <br /> 举例④:<br /> <br /> 实现④:<br /> <br /> 举例⑤:<br /> <br /> 实现⑤:<br /> </p> </li></ol> <h3><a id="4_354"></a>(4)内联标签(行内标签)</h3> <p></p> <h4><a id="_357"></a>第一部分知识点——内联标签的特点:</h4> <pre><code class="prism language-python"><span class="token operator"><</span>!DOCTYPE html<span class="token operator">></span><span class="token operator"><</span>html lang<span class="token operator">=</span><span class="token string">"en"</span><span class="token operator">></span><span class="token operator"><</span>head<span class="token operator">></span> <span class="token operator"><</span>meta charset<span class="token operator">=</span><span class="token string">"UTF-8"</span><span class="token operator">></span> <span class="token operator"><</span>title<span class="token operator">></span>内联标签,又称行内标签的特点<span class="token operator"><</span><span class="token operator">/</span>title<span class="token operator">></span><span class="token operator"><</span><span class="token operator">/</span>head<span class="token operator">></span><span class="token operator"><</span>body<span class="token operator">></span> <span class="token operator"><</span>!<span class="token operator">-</span><span class="token operator">-</span>内联标签的特点(通过文本标签span说明)<span class="token operator">-</span><span class="token operator">-</span><span class="token operator">></span> <span class="token operator"><</span>!<span class="token operator">-</span><span class="token operator">-</span><span class="token number">1</span><span class="token punctuation">.</span>设置宽高无效,以及外边距和内边距都无法控制<span class="token operator">-</span><span class="token operator">-</span><span class="token operator">></span> <span class="token operator"><</span>!<span class="token operator">-</span><span class="token operator">-</span><span class="token number">2</span><span class="token punctuation">.</span>宽度就是其文字或者图片宽度,无法控制<span class="token operator">-</span><span class="token operator">-</span><span class="token operator">></span> <span class="token operator"><</span>!<span class="token operator">-</span><span class="token operator">-</span><span class="token number">3</span><span class="token punctuation">.</span>不会进行自动换行,只有本行放满才会放下一行<span class="token operator">-</span><span class="token operator">-</span><span class="token operator">></span> <span class="token operator"><</span>!<span class="token operator">-</span><span class="token operator">-</span><span class="token number">4</span><span class="token punctuation">.</span>当多个内联标签写在一起时,默认排列方式是从左往右<span class="token operator">-</span><span class="token operator">-</span><span class="token operator">></span> <span class="token operator"><</span>!<span class="token operator">-</span><span class="token operator">-</span><span class="token number">5</span><span class="token punctuation">.</span>内联元素只能容纳文本或者其他内联元素<span class="token operator">-</span><span class="token operator">-</span><span class="token operator">></span> <span class="token operator"><</span>span<span class="token operator">></span>我是个文本标签<span class="token operator"><</span><span class="token operator">/</span>span<span class="token operator">></span><span class="token operator"><</span><span class="token operator">/</span>body<span class="token operator">></span><span class="token operator"><</span><span class="token operator">/</span>html<span class="token operator">></span></code></pre> <h4><a id="_380"></a>第二部分知识点——常用的内联标签:</h4> <p>总共有四种:</p> <ol><li>图片标签</li></ol> <pre><code class="prism language-html"> <span class="token comment"><!--第一个:图片标签 img + Tab--></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>img</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span> <span class="token attr-name">alt</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span> <span class="token attr-name">width</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span> <span class="token attr-name">height</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token comment"><!--src是图片的地址,可以直接是网页里的图片地址, 也可以是本地图片的地址(推荐使用相对路径——相对的含义:图片相对于Html文件的位置,参照物是html文件!--></span> <span class="token comment"><!-- alt是当图片加载失败时显示的内容--></span> <span class="token comment"><!-- width是图片宽度;height是图片高度。不指定按原图大小显示注意。:如果二者只指定一个,另外一个会等比例缩放 --></span> <span class="token comment"><!-- img不是块元素(block),也不算行元素(inline),它是行级块元素(inline-block) --></span></code></pre> <ol start="2"><li>粗体/斜体标签</li></ol> <pre><code class="prism language-html"> <span class="token comment"><!--第二个:粗体/斜体标签 b+ Tab i+ Tab --></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>b</span><span class="token punctuation">></span></span>我是粗体<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>b</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>i</span><span class="token punctuation">></span></span>我是斜体<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>i</span><span class="token punctuation">></span></span></code></pre> <ol start="3"><li>超链接标签</li></ol> <pre><code class="prism language-html"> <span class="token comment"><!--第三个:超链接标签 _self本身网页上打开;_blank打开一个新网页--></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span> <span class="token attr-name">title</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>超链接的一个说明(鼠标放上会显示的文本)<span class="token punctuation">"</span></span> <span class="token attr-name">target</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>_self<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>我是超链接<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> <span class="token comment"><!--href里可以写网址,可以写文件路径--></span> <span class="token comment"><!-- 如果href="" 那么点击后会刷新当前网页,而且会回到顶部 --></span> <span class="token comment"><!-- 如果href="#" 那么点击后,会回到顶部,但不会刷新页面 --></span> <span class="token comment"><!-- 如果href="#锚点" 那么点击后,会跳到指定的锚点处(锚点其实就是一个id值)! --></span></code></pre> <ol start="4"><li>文本标签</li></ol> <pre><code class="prism language-html"> <span class="token comment"><!--第四个:文字标签 和css配合使用才有用哦!--></span> <span class="token comment"><!-- span是一个纯净的行元素;所谓的纯净——没有任何默认样式; --></span> <span class="token comment"><!-- span最大的优势:设定样式,主要作用于行元素或者文字等 --></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>span</span><span class="token punctuation">></span></span>我是文本标签<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>span</span><span class="token punctuation">></span></span></code></pre> <table><tbody><tr><td bgcolor="yellow">知识点补给站第一站点:</td></tr></tbody></table> <p>如果图片标签里填的是本地图片的地址(相对路径):<br /> 1.如果图片在同级目录下,直接: 当前目录名/图片名<br /> 或者: ./当前目录名/图片名<br /> 2.如果图片在上级目录下,直接: . ./图片名</p> <table><tbody><tr><td bgcolor="yellow">知识点补给站第二站点:</td></tr></tbody></table> <p><br /> 至于为什么要实现行内标签和块状标签的相互转换,小伙伴们在设置css样式时会get到这个点哦。<br /> <font color="Blue">比如:块状标签是不能放在一行了,但我们可以通过先转换为行内标签就可以了!!!<br /> </font></p> <p></p> <h1><a id="In_The_End_446"></a>In The End!</h1> <p></p> <table><tbody><tr><td bgcolor="yellow">从现在做起,坚持下去,一天进步一小点,不久的将来,你会感谢曾经努力的你!</td></tr></tbody></table> <p> <strong>本博主会持续更新爬虫基础分栏及爬虫实战分栏(为了小伙伴们更好的进行页面解析,也会更新部分前端必备知识点博文!),认真仔细看完本文的小伙伴们,可以点赞收藏并评论出你们的读后感。并可关注本博主,在今后的日子里阅读更多爬虫文!</strong></p> <pre><code class="prism language-powershell"> 如有错误或者言语不恰当的地方可在评论区指出,谢谢! 如转载此文请联系我说明用以意并标注出处及本博主名,谢谢!</code></pre> <p> </p> <p><span id="jump99"></span></p><center> ??可通过点击下面——>关注本人运营 <strong>公众号</strong>??</center><p></p> <center> <font size="1">【可以公众号里私聊并标明来自CSDN,会拉你进入技术交流群(群内涉及各个领域大佬级人物,任何问题都可讨论~)--->互相学习&&共同进步(非诚勿扰)】</font></center> </div> <link href="https://csdnimg.cn/release/blogv2/dist/mdeditor/css/editerView/markdown_views-d7a94ec6ab.css" rel="stylesheet"> <link href="https://csdnimg.cn/release/blogv2/dist/mdeditor/css/style-49037e4d27.css" rel="stylesheet"> </div> <div id="blogExtensionBox" style="width:400px;margin:auto;margin-top:12px" class="blog-extension-box"></div>
</div>
<div class="mt-64 tags-seach" >
<div class="tags-info">
<a style="width:120px;" title="GPU云服务器" href="https://www.ucloud.cn/site/product/gpu.html">GPU云服务器</a>
<a style="width:120px;" title="云服务器" href="https://www.ucloud.cn/site/active/kuaijiesale.html?ytag=seo">云服务器</a>
<a style="width:120px;" title="html收藏" href="https://www.ucloud.cn/yun/tag/htmlshoucang/">html收藏</a>
<a style="width:120px;" title="大数据平台部署 建议" href="https://www.ucloud.cn/yun/tag/dashujupingtaibushu jianyi/">大数据平台部署 建议</a>
<a style="width:120px;" title="html收藏夹代码" href="https://www.ucloud.cn/yun/tag/htmlshoucangjiadaima/">html收藏夹代码</a>
<a style="width:120px;" title="html字" href="https://www.ucloud.cn/yun/tag/htmlzi/">html字</a>
</div>
</div>
<div class="entry-copyright mb-30">
<p class="mb-15"> 文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。</p>
<p>转载请注明本文地址:https://www.ucloud.cn/yun/122442.html</p>
</div>
<ul class="pre-next-page">
<li class="ellipsis"><a class="hpf" href="https://www.ucloud.cn/yun/122441.html">上一篇:【Python爬虫】手把手带你爬下肯德基官网(ajax的post请求)</a></li>
<li class="ellipsis"><a class="hpf" href="https://www.ucloud.cn/yun/122443.html">下一篇:我用Python逆向登录世界上最大的游戏平台,steam加密手段有多高明【内附源码】</a></li>
</ul>
</div>
<div class="about_topicone-mid">
<h3 class="top-com-title mb-0"><span data-id="0">相关文章</span></h3>
<ul class="com_white-left-mid atricle-list-box">
<li>
<div class="atricle-list-right">
<h2 class="ellipsis2"><a class="hpf" href="https://www.ucloud.cn/yun/121429.html"><b>糊涂算法之「八<em>大</em>排序」<em>总结</em>——用<em>两万</em><em>字</em>,8张动图,450行代码跨过排序这道坎(<em>建议</em><em>收藏</em>)</b></a></h2>
<p class="ellipsis2 good">摘要:今天,一条就带大家彻底跨过排序算法这道坎,保姆级教程建议收藏。利用递归算法,对分治后的子数组进行排序。基本思想堆排序是利用堆这种数据结构而设计的一种排序算法,堆排序是一种选择排序,它的最坏,最好,平均时间复杂度均为,它也是不稳定排序。 ...</p>
<div class="com_white-left-info">
<div class="com_white-left-infol">
<a href="https://www.ucloud.cn/yun/u-392.html"><img src="https://www.ucloud.cn/yun/data/avatar/000/00/03/small_000000392.jpg" alt=""><span class="layui-hide64">greatwhole</span></a>
<time datetime="">2021-09-28 09:36</time>
<span><i class="fa fa-commenting"></i>评论0</span>
<span><i class="fa fa-star"></i>收藏0</span>
</div>
</div>
</div>
</li>
<li>
<div class="atricle-list-right">
<h2 class="ellipsis2"><a class="hpf" href="https://www.ucloud.cn/yun/119824.html"><b><em>保姆</em><em>级</em><em>教程</em>带你开发优质的Python库之<em>上篇</em>【<em>建议</em><em>收藏</em>】</b></a></h2>
<p class="ellipsis2 good">摘要:正式的专栏第篇,同学站住,别错过这个从开始的文章前面学委的入门到精通专栏积累了篇文章,当然学委博客还有几十篇应用的文章。 正式的Python专栏第9篇,同学站住...</p>
<div class="com_white-left-info">
<div class="com_white-left-infol">
<a href="https://www.ucloud.cn/yun/u-1164.html"><img src="https://www.ucloud.cn/yun/data/avatar/000/00/11/small_000001164.jpg" alt=""><span class="layui-hide64">hyuan</span></a>
<time datetime="">2021-09-10 10:51</time>
<span><i class="fa fa-commenting"></i>评论0</span>
<span><i class="fa fa-star"></i>收藏0</span>
</div>
</div>
</div>
</li>
<li>
<div class="atricle-list-right">
<h2 class="ellipsis2"><a class="hpf" href="https://www.ucloud.cn/yun/120967.html"><b>13 万<em>字</em> C 语言从入门到精通<em>保姆</em><em>级</em><em>教程</em>2021 年版 (<em>建议</em><em>收藏</em>)</b></a></h2>
<p class="ellipsis2 good">摘要:友情提示先关注收藏,再查看,万字保姆级语言从入门到精通教程。及大牛出天地开始有随之乃有万种语年英国剑桥大学推出了语言。 友情提示:先关注收藏,再查看,13 万字保...</p>
<div class="com_white-left-info">
<div class="com_white-left-infol">
<a href="https://www.ucloud.cn/yun/u-1432.html"><img src="https://www.ucloud.cn/yun/data/avatar/000/00/14/small_000001432.jpg" alt=""><span class="layui-hide64">zombieda</span></a>
<time datetime="">2021-09-24 09:48</time>
<span><i class="fa fa-commenting"></i>评论0</span>
<span><i class="fa fa-star"></i>收藏0</span>
</div>
</div>
</div>
</li>
<li>
<div class="atricle-list-right">
<h2 class="ellipsis2"><a class="hpf" href="https://www.ucloud.cn/yun/121531.html"><b>从小白程序员一路晋升为<em>大</em>厂高<em>级</em>技术专家我看过哪些书籍?(<em>建议</em><em>收藏</em>)</b></a></h2>
<p class="ellipsis2 good">摘要:大家好,我是冰河有句话叫做投资啥都不如投资自己的回报率高。马上就十一国庆假期了,给小伙伴们分享下,从小白程序员到大厂高级技术专家我看过哪些技术类书籍。 大家好,我是...</p>
<div class="com_white-left-info">
<div class="com_white-left-infol">
<a href="https://www.ucloud.cn/yun/u-986.html"><img src="https://www.ucloud.cn/yun/data/avatar/000/00/09/small_000000986.jpg" alt=""><span class="layui-hide64">sf_wangchong</span></a>
<time datetime="">2021-09-29 09:35</time>
<span><i class="fa fa-commenting"></i>评论0</span>
<span><i class="fa fa-star"></i>收藏0</span>
</div>
</div>
</div>
</li>
<li>
<div class="atricle-list-right">
<h2 class="ellipsis2"><a class="hpf" href="https://www.ucloud.cn/yun/118774.html"><b>【<em>保姆</em><em>级</em><em>教程</em>】从零到精通Git,CodeChina实战</b></a></h2>
<p class="ellipsis2 good">摘要:因为是全中文的,对一些英语不好的人来说确实是福利。二下载安装下载官网下载地址进去之后,点击点击后就会自动下载了。 文章目录 推荐系列教程,推荐的一定是精选的!一....</p>
<div class="com_white-left-info">
<div class="com_white-left-infol">
<a href="https://www.ucloud.cn/yun/u-206.html"><img src="https://www.ucloud.cn/yun/data/avatar/000/00/02/small_000000206.jpg" alt=""><span class="layui-hide64">lyning</span></a>
<time datetime="">2021-09-02 15:11</time>
<span><i class="fa fa-commenting"></i>评论0</span>
<span><i class="fa fa-star"></i>收藏0</span>
</div>
</div>
</div>
</li>
</ul>
</div>
<div class="topicone-box-wangeditor">
<h3 class="top-com-title mb-64"><span>发表评论</span></h3>
<div class="xcp-publish-main flex_box_zd">
<div class="unlogin-pinglun-box">
<a href="javascript:login()" class="grad">登陆后可评论</a>
</div> </div>
</div>
<div class="site-box-content">
<div class="site-content-title">
<h3 class="top-com-title mb-64"><span>0条评论</span></h3>
</div>
<div class="pages"></ul></div>
</div>
</div>
<div class="layui-col-md4 layui-col-lg3 com_white-right site-wrap-right">
<div class="">
<div class="com_layuiright-box user-msgbox">
<a href="https://www.ucloud.cn/yun/u-668.html"><img src="https://www.ucloud.cn/yun/data/avatar/000/00/06/small_000000668.jpg" alt=""></a>
<h3><a href="https://www.ucloud.cn/yun/u-668.html" rel="nofollow">paulli3</a></h3>
<h6>男<span>|</span>高级讲师</h6>
<div class="flex_box_zd user-msgbox-atten">
<a href="javascript:attentto_user(668)" id="attenttouser_668" class="grad follow-btn notfollow attention">我要关注</a>
<a href="javascript:login()" title="发私信" >我要私信</a>
</div>
<div class="user-msgbox-list flex_box_zd">
<h3 class="hpf">TA的文章</h3>
<a href="https://www.ucloud.cn/yun/ut-668.html" class="box_hxjz">阅读更多</a>
</div>
<ul class="user-msgbox-ul">
<li><h3 class="ellipsis"><a href="https://www.ucloud.cn/yun/123686.html">【STM32+cubemx】0011 HAL库开发:I2C总线访问加速度传感器ADXL345</a></h3>
<p>阅读 2479<span>·</span>2021-11-18 10:02</p></li>
<li><h3 class="ellipsis"><a href="https://www.ucloud.cn/yun/122442.html">保姆级教程HTML两万字笔记大总结【建议收藏】(上篇)</a></h3>
<p>阅读 1997<span>·</span>2021-10-13 09:40</p></li>
<li><h3 class="ellipsis"><a href="https://www.ucloud.cn/yun/119444.html">DediPath九月4折:洛杉矶VPS月付1.4美元起;美国独立服务器月付39美元起</a></h3>
<p>阅读 3049<span>·</span>2021-09-07 10:07</p></li>
<li><h3 class="ellipsis"><a href="https://www.ucloud.cn/yun/119169.html">TOB主題2.7版本更新:重做文章主列表、新增菜單圖標支持、麵包屑、彩色標籤、縮略圖圓角</a></h3>
<p>阅读 2157<span>·</span>2021-09-04 16:48</p></li>
<li><h3 class="ellipsis"><a href="https://www.ucloud.cn/yun/115456.html">前端开源项目周报0103</a></h3>
<p>阅读 1050<span>·</span>2019-08-30 13:18</p></li>
<li><h3 class="ellipsis"><a href="https://www.ucloud.cn/yun/112894.html">CSS盒子模型以及外边框合并的问题</a></h3>
<p>阅读 2491<span>·</span>2019-08-29 14:03</p></li>
<li><h3 class="ellipsis"><a href="https://www.ucloud.cn/yun/112231.html">CSS display属性</a></h3>
<p>阅读 2969<span>·</span>2019-08-29 12:54</p></li>
<li><h3 class="ellipsis"><a href="https://www.ucloud.cn/yun/107383.html">可拖动table表头的实现</a></h3>
<p>阅读 3199<span>·</span>2019-08-26 11:41</p></li>
</ul>
</div>
<!-- 文章详情右侧广告-->
<div class="com_layuiright-box">
<h6 class="top-com-title"><span>最新活动</span></h6>
<div class="com_adbox">
<div class="layui-carousel" id="right-item">
<div carousel-item>
<div>
<a href="https://www.ucloud.cn/site/active/kuaijiesale.html?ytag=seo" rel="nofollow">
<img src="https://www.ucloud.cn/yun/data/attach/240625/2rTjEHmi.png" alt="云服务器">
</a>
</div>
<div>
<a href="https://www.ucloud.cn/site/product/gpu.html" rel="nofollow">
<img src="https://www.ucloud.cn/yun/data/attach/240807/7NjZjdrd.png" alt="GPU云服务器">
</a>
</div>
</div>
</div>
</div> <!-- banner结束 -->
<div class="adhtml">
</div>
<script>
$(function(){
$.ajax({
type: "GET",
url:"https://www.ucloud.cn/yun/ad/getad/1.html",
cache: false,
success: function(text){
$(".adhtml").html(text);
}
});
})
</script> </div> </div>
</div>
</div>
</div>
</section>
<!-- wap拉出按钮 -->
<div class="site-tree-mobile layui-hide">
<i class="layui-icon layui-icon-spread-left"></i>
</div>
<!-- wap遮罩层 -->
<div class="site-mobile-shade"></div>
<!--付费阅读 -->
<div id="payread">
<div class="layui-form-item">阅读需要支付1元查看</div>
<div class="layui-form-item"><button class="btn-right">支付并查看</button></div>
</div>
<script>
var prei=0;
$(".site-seo-depict pre").each(function(){
var html=$(this).html().replace("<code>","").replace("</code>","").replace('<code class="javascript hljs" codemark="1">','');
$(this).attr('data-clipboard-text',html).attr("id","pre"+prei);
$(this).html("").append("<code>"+html+"</code>");
prei++;
})
$(".site-seo-depict img").each(function(){
if($(this).attr("src").indexOf('data:image/svg+xml')!= -1){
$(this).remove();
}
})
$("LINK[href*='style-49037e4d27.css']").remove();
$("LINK[href*='markdown_views-d7a94ec6ab.css']").remove();
layui.use(['jquery', 'layer','code'], function(){
$("pre").attr("class","layui-code");
$("pre").attr("lay-title","");
$("pre").attr("lay-skin","");
layui.code();
$(".layui-code-h3 a").attr("class","copycode").html("复制代码 ").attr("onclick","copycode(this)");
});
function copycode(target){
var id=$(target).parent().parent().attr("id");
var clipboard = new ClipboardJS("#"+id);
clipboard.on('success', function(e) {
e.clearSelection();
alert("复制成功")
});
clipboard.on('error', function(e) {
alert("复制失败")
});
}
//$(".site-seo-depict").html($(".site-seo-depict").html().slice(0, -5));
</script>
<link rel="stylesheet" type="text/css" href="https://www.ucloud.cn/yun/static/js/neweditor/code/styles/tomorrow-night-eighties.css">
<script src="https://www.ucloud.cn/yun/static/js/neweditor/code/highlight.pack.js" type="text/javascript"></script>
<script src="https://www.ucloud.cn/yun/static/js/clipboard.js"></script>
<script>hljs.initHighlightingOnLoad();</script>
<script>
function setcode(){
var _html='';
document.querySelectorAll('pre code').forEach((block) => {
var _tmptext=$.trim($(block).text());
if(_tmptext!=''){
_html=_html+_tmptext;
console.log(_html);
}
});
}
</script>
<script>
function payread(){
layer.open({
type: 1,
title:"付费阅读",
shadeClose: true,
content: $('#payread')
});
}
// 举报
function jupao_tip(){
layer.open({
type: 1,
title:false,
shadeClose: true,
content: $('#jubao')
});
}
$(".getcommentlist").click(function(){
var _id=$(this).attr("dataid");
var _tid=$(this).attr("datatid");
$("#articlecommentlist"+_id).toggleClass("hide");
var flag=$("#articlecommentlist"+_id).attr("dataflag");
if(flag==1){
flag=0;
}else{
flag=1;
//加载评论
loadarticlecommentlist(_id,_tid);
}
$("#articlecommentlist"+_id).attr("dataflag",flag);
})
$(".add-comment-btn").click(function(){
var _id=$(this).attr("dataid");
$(".formcomment"+_id).toggleClass("hide");
})
$(".btn-sendartcomment").click(function(){
var _aid=$(this).attr("dataid");
var _tid=$(this).attr("datatid");
var _content=$.trim($(".commenttext"+_aid).val());
if(_content==''){
alert("评论内容不能为空");
return false;
}
var touid=$("#btnsendcomment"+_aid).attr("touid");
if(touid==null){
touid=0;
}
addarticlecomment(_tid,_aid,_content,touid);
})
$(".button_agree").click(function(){
var supportobj = $(this);
var tid = $(this).attr("id");
$.ajax({
type: "GET",
url:"https://www.ucloud.cn/yun/index.php?topic/ajaxhassupport/" + tid,
cache: false,
success: function(hassupport){
if (hassupport != '1'){
$.ajax({
type: "GET",
cache:false,
url: "https://www.ucloud.cn/yun/index.php?topic/ajaxaddsupport/" + tid,
success: function(comments) {
supportobj.find("span").html(comments+"人赞");
}
});
}else{
alert("您已经赞过");
}
}
});
});
function attenquestion(_tid,_rs){
$.ajax({
//提交数据的类型 POST GET
type:"POST",
//提交的网址
url:"https://www.ucloud.cn/yun/favorite/topicadd.html",
//提交的数据
data:{tid:_tid,rs:_rs},
//返回数据的格式
datatype: "json",//"xml", "html", "script", "json", "jsonp", "text".
//在请求之前调用的函数
beforeSend:function(){},
//成功返回之后调用的函数
success:function(data){
var data=eval("("+data+")");
console.log(data)
if(data.code==2000){
layer.msg(data.msg,function(){
if(data.rs==1){
//取消收藏
$(".layui-layer-tips").attr("data-tips","收藏文章");
$(".layui-layer-tips").html('<i class="fa fa-heart-o"></i>');
}
if(data.rs==0){
//收藏成功
$(".layui-layer-tips").attr("data-tips","已收藏文章");
$(".layui-layer-tips").html('<i class="fa fa-heart"></i>')
}
})
}else{
layer.msg(data.msg)
}
} ,
//调用执行后调用的函数
complete: function(XMLHttpRequest, textStatus){
postadopt=true;
},
//调用出错执行的函数
error: function(){
//请求出错处理
postadopt=false;
}
});
}
</script>
<footer>
<div class="layui-container">
<div class="flex_box_zd">
<div class="left-footer">
<h6><a href="https://www.ucloud.cn/"><img src="https://www.ucloud.cn/yun/static/theme/ukd//images/logo.png" alt="UCloud (优刻得科技股份有限公司)"></a></h6>
<p>UCloud (优刻得科技股份有限公司)是中立、安全的云计算服务平台,坚持中立,不涉足客户业务领域。公司自主研发IaaS、PaaS、大数据流通平台、AI服务平台等一系列云计算产品,并深入了解互联网、传统企业在不同场景下的业务需求,提供公有云、混合云、私有云、专有云在内的综合性行业解决方案。</p>
</div>
<div class="right-footer layui-hidemd">
<ul class="flex_box_zd">
<li>
<h6>UCloud与云服务</h6>
<p><a href="https://www.ucloud.cn/site/about/intro/">公司介绍</a></p>
<p><a href="https://zhaopin.ucloud.cn/" >加入我们</a></p>
<p><a href="https://www.ucloud.cn/site/ucan/onlineclass/">UCan线上公开课</a></p>
<p><a href="https://www.ucloud.cn/site/solutions.html" >行业解决方案</a></p> <p><a href="https://www.ucloud.cn/site/pro-notice/">产品动态</a></p>
</li>
<li>
<h6>友情链接</h6> <p><a href="https://www.compshare.cn/?ytag=seo">GPU算力平台</a></p> <p><a href="https://www.ucloudstack.com/?ytag=seo">UCloud私有云</a></p>
<p><a href="https://www.surfercloud.com/">SurferCloud</a></p> <p><a href="https://www.uwin-link.com/">工厂仿真软件</a></p> <p><a href="https://pinex.it/">Pinex</a></p> <p><a href="https://www.picpik.ai/zh">AI绘画</a></p>
</li>
<li>
<h6>社区栏目</h6>
<p><a href="https://www.ucloud.cn/yun/column/index.html">专栏文章</a></p>
<p><a href="https://www.ucloud.cn/yun/udata/">专题地图</a></p> </li>
<li>
<h6>常见问题</h6>
<p><a href="https://www.ucloud.cn/site/ucsafe/notice.html" >安全中心</a></p>
<p><a href="https://www.ucloud.cn/site/about/news/recent/" >新闻动态</a></p>
<p><a href="https://www.ucloud.cn/site/about/news/report/">媒体动态</a></p> <p><a href="https://www.ucloud.cn/site/cases.html">客户案例</a></p>
<p><a href="https://www.ucloud.cn/site/notice/">公告</a></p>
</li>
<li>
<span><img src="https://static.ucloud.cn/7a4b6983f4b94bcb97380adc5d073865.png" alt="优刻得"></span>
<p>扫扫了解更多</p></div>
</div>
<div class="copyright">Copyright © 2012-2023 UCloud 优刻得科技股份有限公司<i>|</i><a rel="nofollow" href="http://beian.miit.gov.cn/">沪公网安备 31011002000058号</a><i>|</i><a rel="nofollow" href="http://beian.miit.gov.cn/"></a> 沪ICP备12020087号-3</a><i>|</i> <script type="text/javascript" src="https://gyfk12.kuaishang.cn/bs/ks.j?cI=197688&fI=125915" charset="utf-8"></script>
<script>
var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?290c2650b305fc9fff0dbdcafe48b59d";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-DZSMXQ3P9N"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-DZSMXQ3P9N');
</script>
<script>
(function(){
var el = document.createElement("script");
el.src = "https://lf1-cdn-tos.bytegoofy.com/goofy/ttzz/push.js?99f50ea166557aed914eb4a66a7a70a4709cbb98a54ecb576877d99556fb4bfc3d72cd14f8a76432df3935ab77ec54f830517b3cb210f7fd334f50ccb772134a";
el.id = "ttzz";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(el, s);
})(window)
</script></div>
</div>
</footer>
</body>
<script src="https://www.ucloud.cn/yun/static/theme/ukd/js/common.js"></script>
<<script type="text/javascript">
$(".site-seo-depict *,.site-content-answer-body *,.site-body-depict *").css("max-width","100%");
</script>
</html>