【HTML入门学习笔记（三）】

qq_18307045

已于 2022-04-26 22:06:37 修改

阅读量54

点赞数

分类专栏：学习笔记 HTML 文章标签： html

于 2022-04-26 21:50:55 首次发布

本文链接：https://blog.csdn.net/qq_18307045/article/details/124436486

版权

学习笔记同时被 2 个专栏收录

11 篇文章 0 订阅

订阅专栏

HTML

4 篇文章 0 订阅

订阅专栏

本文介绍了HTML的元素及其子元素如、<base>、<link>、<meta>和<style>的用途。同时讲解了CSS的基础知识，包括背景颜色、字体样式和文本对齐方式的设置。通过实例展示了如何使用CSS来改变网页的视觉呈现。 </div> <span>摘要由CSDN通过智能技术生成</span> </div> </div> <article class="baidu_pl"> <div id="article_content" class="article_content clearfix"> <link rel="stylesheet" href="https://csdnimg.cn/release/blogv2/dist/mdeditor/css/editerView/kdoc_html_views-1a98987dfd.css"> <link rel="stylesheet" href="https://csdnimg.cn/release/blogv2/dist/mdeditor/css/editerView/ck_htmledit_views-044f2cf1dc.css"> <div id="content_views" class="markdown_views prism-atom-one-dark"> <svg xmlns="http://www.w3.org/2000/svg" style="display: none;"> <path stroke-linecap="round" d="M5,0 0,2.5 5,5z" id="raphael-marker-block" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);"></path> </svg> <h2><a id="HTML_0"></a>HTML入门学习笔记（三）</h2> <p>参考: <a href="https://www.runoob.com/html/html-tutorial.html" rel="nofollow">https://www.runoob.com/html/html-tutorial.html</a>.</p> <hr /> <p></p> <div class="toc"> <h4>文章目录</h4> <ul><li><a href="#HTML_0" rel="nofollow">HTML入门学习笔记（三）</a></li><li><a href="#_11" rel="nofollow">前言</a></li><li><a href="#HTML_head_20" rel="nofollow">一、HTML head元素</a></li><li><a href="#HTML__CSS_83" rel="nofollow">二、HTML 样式- CSS</a></li><li><ul><li><a href="#1CSS_84" rel="nofollow">1.什么是CSS？</a></li><li><a href="#2_93" rel="nofollow">2.背景颜色</a></li><li><a href="#3___103" rel="nofollow">3.字体, 字体颜色，字体大小</a></li><li><a href="#4_114" rel="nofollow">4.文本对齐方式</a></li></ul> </li><li><a href="#HTML__149" rel="nofollow">三、HTML 区块</a></li><li><ul><li><a href="#1_150" rel="nofollow">1.什么是区块?</a></li><li><a href="#2HTML__154" rel="nofollow">2.HTML 内联元素</a></li><li><a href="#3HTML_div_157" rel="nofollow">3.HTML `div`元素</a></li><li><a href="#4HTML_span_162" rel="nofollow">4.HTML `span`元素</a></li></ul> </li><li><a href="#_166" rel="nofollow">总结</a></li></ul> </div> <p></p> <hr /> <h2><a id="_11"></a>前言</h2> <p><s>开摆开摆！</s><br /> 今天的任务也是继续学习我们的HTML，之后要介绍的重点任务比较多，今天就只介绍部分内容。</p> <hr /> <h2><a id="HTML_head_20"></a>一、HTML head元素</h2> <table><thead><tr><th>标签</th><th>描述</th></tr></thead><tbody><tr><td><code><head></code></td><td>定义了文档的信息</td></tr><tr><td><code><title></code></td><td>定义了文档的标题</td></tr><tr><td><code><base></code></td><td>定义了页面链接标签的默认链接地址</td></tr><tr><td><code><link></code></td><td>定义了一个文档和外部资源之间的关系</td></tr><tr><td><code><meta></code></td><td>定义了HTML文档中的元数据</td></tr><tr><td><code><script></code></td><td>定义了客户端的脚本文件</td></tr><tr><td><code><style></code></td><td>定义了HTML文档的样式文件</td></tr></tbody></table> <p><strong>其中:</strong><br /> <code><head></code>:<br /> 元素包含了所有的头部标签元素。在元素中你可以插入脚本（scripts）, 样式文件（CSS），及各种meta信息。可以添加在头部区域的元素标签为: <code><title></code>, <code><style></code>, <code><meta></code>,<code><link></code>, <code><script></code>, <code><noscript></code> 和 <code><base></code>。</p> <ul><li><code><title></code>:<br /> <code><title></code> 标签定义了不同文档的标题。<br /> <code><title></code> 在 HTML/XHTML 文档中是必须的。<br /> <code><title></code> 元素:<br /> — 定义了浏览器工具栏的标题<br /> — 当网页添加到收藏夹时，显示在收藏夹中的标题<br /> — 显示在搜索引擎结果页面的标题</li><li><code><base></code><br /> <code><base></code> 标签描述了基本的链接地址/链接目标，该标签作为HTML文档中所有的链接标签的默认链接</li><li><code><link></code><br /> <code><link></code> 标签定义了文档与外部资源之间的关系。<br /> <code><link></code> 标签通常用于链接到样式表:</li><li><code><meta></code><br /> meta标签描述了一些基本的元数据。<br /> <code><meta></code> 标签提供了元数据.元数据也不显示在页面上，但会被浏览器解析。<br /> META 元素通常用于指定网页的描述，关键词，文件的最后修改时间，作者，和其他元数据。<br /> 元数据可以使用于浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他Web服务。<br /> 一般放置于区域。</li></ul> <blockquote> <p><code><meta></code>使用实例:</p> </blockquote> <ol><li>为搜索引擎添加关键词:</li></ol> <pre><code class="prism language-b"><meta name="keywords" content="HTML, Jee, Jsp"> </code></pre> <ol start="2"><li>为网页定义描述内容:</li></ol> <pre><code class="prism language-b"><meta name="description" content="HTML入门学习笔记（三）"> </code></pre> <ol start="3"><li>定义网页作者:</li></ol> <pre><code class="prism language-b"><meta name="author" content=""> </code></pre> <ul><li> <p><code><script></code>|<br /> <code><script></code>标签用于加载脚本文件，如： JavaScript。</p> </li><li> <p><code><style></code><br /> <code><style></code> 标签定义了HTML文档的样式文件引用地址.</p> </li></ul> <blockquote> <p>在<code><style></code> 元素中你也可以直接添加样式来渲染 HTML 文档:</p> </blockquote> <pre><code class="prism language-b"><head> <style type="text/css"> body {background-color:yellow} p {color:blue} </style> </head> </code></pre> <p><code>当然颜色也可以自己调:（VSCODE上面反正是这样的=-=）</code></p> <p><img src="https://i-blog.csdnimg.cn/blog_migrate/fdaf86121b0ae25bac9b89c60eb18042.png#pic_center" alt="在这里插入图片描述" /></p> <h2><a id="HTML__CSS_83"></a>二、HTML 样式- CSS</h2> <h3><a id="1CSS_84"></a>1.什么是CSS？</h3> <p>CSS 是在 HTML 4 开始使用的,是为了更好的渲染HTML元素而引入的.<br /> CSS 可以通过以下方式添加到HTML中:</p> <ul><li>内联样式- 在HTML元素中使用"style" 属性</li><li>内部样式表 -在HTML文档头部 <code><head></code> 区域使用<code><style></code> 元素来包含CSS</li><li>外部引用 - 使用外部 CSS 文件</li></ul> <p>最好的方式是通过外部引用CSS文件.</p> <h3><a id="2_93"></a>2.背景颜色</h3> <p>背景色属性（background-color）定义一个元素的背景颜色：</p> <pre><code class="prism language-b"><body style="background-color:yellow;"> <h2 style="background-color:red;">这是一个标题</h2> <p style="background-color:green;">这是一个段落。</p> </body> </code></pre> <p><code>效果如下:</code><br /> <img src="https://i-blog.csdnimg.cn/blog_migrate/6d399bd6fd29fc7bec30a60a5b3d97a1.png#pic_center" alt="在这里插入图片描述" /></p> <h3><a id="3___103"></a>3.字体, 字体颜色，字体大小</h3> <p>我们可以使用font-family（字体），color（颜色），和font-size（字体大小）属性来定义字体的样式:</p> <pre><code class="prism language-b"><h1 style="font-family:verdana;">一个标题</h1> <p style="font-family:arial;color:red;font-size:20px;">一个段落。</p> </code></pre> <p><code>效果如下:</code></p> <p><img src="https://i-blog.csdnimg.cn/blog_migrate/c263aadd8cf96f7483582a1fb79f70a8.png#pic_center" alt="在这里插入图片描述" /></p> <h3><a id="4_114"></a>4.文本对齐方式</h3> <p>使用 text-align（文字对齐）属性指定文本的水平与垂直对齐方式：</p> <pre><code class="prism language-b"><h1 style="text-align:center;">居中对齐的标题</h1> <p>这是一个段落。</p> </code></pre> <p><code>效果如下:</code><br /> <img src="https://i-blog.csdnimg.cn/blog_migrate/351cd04d486226df19886f69811a9524.png#pic_center" alt="在这里插入图片描述" /><br /> <code>通过亿点点的拼凑就可以达到以下效果了：</code></p> <pre><code class="prism language-c"><span class="token operator"><</span>div style<span class="token operator">=</span><span class="token string">"opacity:0.5;position:absolute;left:50px;width:300px;height:150px;background-color:#40B3DF"</span><span class="token operator">></span><span class="token operator"><</span><span class="token operator">/</span>div<span class="token operator">></span> <span class="token operator"><</span>div style<span class="token operator">=</span><span class="token string">"font-family:verdana;padding:20px;border-radius:10px;border:10px solid #EE872A;"</span><span class="token operator">></span> <span class="token operator"><</span>div style<span class="token operator">=</span><span class="token string">"opacity:0.3;position:absolute;left:120px;width:100px;height:200px;background-color:#8AC007"</span><span class="token operator">></span><span class="token operator"><</span><span class="token operator">/</span>div<span class="token operator">></span> <span class="token operator"><</span>h3<span class="token operator">></span>Look<span class="token operator">!</span> Styles and colors<span class="token operator"><</span><span class="token operator">/</span>h3<span class="token operator">></span> <span class="token operator"><</span>div style<span class="token operator">=</span><span class="token string">"letter-spacing:12px;"</span><span class="token operator">></span>Manipulate Text<span class="token operator"><</span><span class="token operator">/</span>div<span class="token operator">></span> <span class="token operator"><</span>div style<span class="token operator">=</span><span class="token string">"color:#40B3DF;"</span><span class="token operator">></span>Colors <span class="token operator"><</span>span style<span class="token operator">=</span><span class="token string">"background-color:#B4009E;color:#ffffff;"</span><span class="token operator">></span>Boxes<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>div<span class="token operator">></span> <span class="token operator"><</span>div style<span class="token operator">=</span><span class="token string">"color:#000000;"</span><span class="token operator">></span>and more<span class="token punctuation">.</span><span class="token punctuation">.</span><span class="token punctuation">.</span><span class="token operator"><</span><span class="token operator">/</span>div<span class="token operator">></span> <span class="token operator"><</span><span class="token operator">/</span>div<span class="token operator">></span> </code></pre> <p><img src="https://i-blog.csdnimg.cn/blog_migrate/a837435b05c097aaf8910bd8751b6ccc.png#pic_center" alt="在这里插入图片描述" /><br /> <mark>(亿点难度，有手就行)</mark></p> <p>更多CSS参考:<a href="https://www.runoob.com/css/css-tutorial.html" rel="nofollow">CSS教程</a>.</p> <hr /> <h2><a id="HTML__149"></a>三、HTML 区块</h2> <h3><a id="1_150"></a>1.什么是区块?</h3> <p>大多数 HTML 元素被定义为块级元素或内联元素。<br /> 块级元素在浏览器显示时，通常会以新行来开始（和结束）。<br /> 实例: <code><h1>,<p>, <ul>,<table></code></p> <h3><a id="2HTML__154"></a>2.HTML 内联元素</h3> <p>内联元素在显示时通常不会以新行开始。<br /> 实例: <code><b>, <td>, <a>, <img></code></p> <h3><a id="3HTML_div_157"></a>3.HTML <code>div</code>元素</h3> <p>HTML <code><div></code> 元素是块级元素，它可用于组合其他 HTML 元素的容器。<br /> <code><div></code> 元素没有特定的含义。除此之外，由于它属于块级元素，浏览器会在其前后显示折行。<br /> 如果与 CSS 一同使用，<code><div></code> 元素可用于对大的内容块设置样式属性。<br /> <code><div></code> 元素的另一个常见的用途是文档布局。它取代了使用表格定义布局的老式方法。使用 <code><table></code> 元素进行文档布局不是表格的正确用法。<code><table></code> 元素的作用是显示表格化的数据。</p> <h3><a id="4HTML_span_162"></a>4.HTML <code>span</code>元素</h3> <p>HTML <code><span></code> 元素是内联元素，可用作文本的容器<br /> <code><span></code>元素也没有特定的含义。<br /> 当与 CSS 一同使用时，<code><span></code> 元素可用于为部分文本设置样式属性。</p> <h2><a id="_166"></a>总结</h2> <p><s>卷不动了，躺会</s><br /> 以上就是今天的HTML学习内容了，若有错误还望指出。<br /> <strong>加油加油加油！！！</strong></p> </div> <link href="https://csdnimg.cn/release/blogv2/dist/mdeditor/css/editerView/markdown_views-f23dff6052.css" rel="stylesheet"> <link href="https://csdnimg.cn/release/blogv2/dist/mdeditor/css/style-c216769e99.css" rel="stylesheet"> </div> <div id="treeSkill"></div> </article> <script> $(function() { setTimeout(function () { var mathcodeList = document.querySelectorAll('.htmledit_views img.mathcode'); if (mathcodeList.length > 0) { for (let i = 0; i < mathcodeList.length; i++) { if (mathcodeList[i].naturalWidth === 0 || mathcodeList[i].naturalHeight === 0) { var alt = mathcodeList[i].alt; alt = '\$' + alt + '\$'; var curSpan = $('<span class="img-codecogs"></span>'); curSpan.text(alt); $(mathcodeList[i]).before(curSpan); $(mathcodeList[i]).remove(); } } MathJax.Hub.Queue(["Typeset",MathJax.Hub]); } }, 1000) }); </script> </div> <div class="directory-boxshadow-dialog" style="display:none;"> <div class="directory-boxshadow-dialog-box"> </div> <div class="vip-limited-time-offer-box-new" id="vip-limited-time-offer-box-new"> <img class="limited-img limited-img-new" src="https://csdnimg.cn/release/blogv2/dist/pc/img/vip-limited-close-newWhite.png"> <div class="vip-limited-time-top"> 确定要放弃本次机会？ </div> <span class="vip-limited-time-text">福利倒计时</span> <div class="limited-time-box-new"> <span class="time-hour"></span> <i>:</i> <span class="time-minite"></span> <i>:</i> <span class="time-second"></span> </div> <div class="limited-time-vip-box"> <p> <img class="coupon-img" src="https://csdnimg.cn/release/blogv2/dist/pc/img/vip-limited-close-roup.png"> <span class="def">立减 ¥</span> <span class="active limited-num"></span> </p> <span class="">普通VIP年卡可用</span> </div> <a class="limited-time-btn-new" href="https://mall.csdn.net/vip" data-report-click='{"spm":"1001.2101.3001.9621"}' data-report-query='spm=1001.2101.3001.9621'>立即使用</a> </div> </div> <div class="more-toolbox-new" id="toolBarBox"> <div class="left-toolbox"> <div class="toolbox-left"> <div class="profile-box"> <a class="profile-href" target="_blank" href="https://blog.csdn.net/qq_18307045"><img class="profile-img" src="https://profile-avatar.csdnimg.cn/fee2d93356c14cbb93be3c1f39bf1488_qq_18307045.jpg!1"> <span class="profile-name"> qq_18307045 </span> </a> </div> <div class="profile-attend"> <a class="tool-attend tool-bt-button tool-bt-attend" href="javascript:;" data-report-view='{"mod":"1592215036_002","spm":"1001.2101.3001.4232","extend1":"关注"}'>关注</a> <a class="tool-item-follow active-animation" style="display:none;">关注</a> </div> </div> <div class="toolbox-middle"> <ul class="toolbox-list"> <li class="tool-item tool-item-size tool-active is-like" id="is-like"> <a class="tool-item-href"> <img style="display:none;" id="is-like-imgactive-animation-like" class="animation-dom active-animation" src="https://csdnimg.cn/release/blogv2/dist/pc/img/tobarThumbUpactive.png" alt=""> <img class="isactive" style="display:none" id="is-like-imgactive" src="https://csdnimg.cn/release/blogv2/dist/pc/img/newHeart2021Active.png" alt=""> <img class="isdefault" style="display:block" id="is-like-img" src="https://csdnimg.cn/release/blogv2/dist/pc/img/newHeart2021Black.png" alt=""> <span id="spanCount" class="count "> 0 </span> </a> <div class="tool-hover-tip"><span class="text space">点赞</span></div> </li> <li class="tool-item tool-item-size tool-active is-unlike" id="is-unlike"> <a class="tool-item-href"> <img class="isactive" style="margin-right:0px;display:none" id="is-unlike-imgactive" src="https://csdnimg.cn/release/blogv2/dist/pc/img/newUnHeart2021Active.png" alt=""> <img class="isdefault" style="margin-right:0px;display:block" id="is-unlike-img" src="https://csdnimg.cn/release/blogv2/dist/pc/img/newUnHeart2021Black.png" alt=""> <span id="unlikeCount" class="count "></span> </a> <div class="tool-hover-tip"><span class="text space">踩</span></div> </li> <li class="tool-item tool-item-size tool-active is-collection "> <a class="tool-item-href" href="javascript:;" data-report-click='{"mod":"popu_824","spm":"1001.2101.3001.4130","ab":"new"}'> <img style="display:none" id="is-collection-img-collection" class="animation-dom active-animation" src="https://csdnimg.cn/release/blogv2/dist/pc/img/tobarCollectionActive.png" alt=""> <img class="isdefault" id="is-collection-img" style="display:block" src="https://csdnimg.cn/release/blogv2/dist/pc/img/newCollectBlack.png" alt=""> <img class="isactive" id="is-collection-imgactive" style="display:none" src="https://csdnimg.cn/release/blogv2/dist/pc/img/newCollectActive.png" alt=""> <span class="count get-collection " data-num="0" id="get-collection"> 0 </span> </a> <div class="tool-hover-tip collect"> <div class="collect-operate-box"> <span class="collect-text" id="is-collection"> 收藏 </span> </div> </div> <div class="tool-active-list"> <div class="text"> 觉得还不错? <span class="collect-text" id="tool-active-list-collection"> 一键收藏 </span> <img id="tool-active-list-close" src="https://csdnimg.cn/release/blogv2/dist/pc/img/collectionCloseWhite.png" alt=""> </div> </div> </li> <li class="tool-item tool-item-size tool-active tool-item-comment"> <div class="guide-rr-first"> <img src="https://csdnimg.cn/release/blogv2/dist/pc/img/guideRedReward01.png" alt=""> <button class="btn-guide-known">知道了</button> </div> <a class="tool-item-href" href="#commentBox" data-report-click='{"spm":"1001.2101.3001.7009"}'> <img class="isdefault" src="https://csdnimg.cn/release/blogv2/dist/pc/img/newComment2021Black.png" alt=""> <span class="count"> 0 </span> </a> <div class="tool-hover-tip"><span class="text space">评论</span></div> </li> <li class="tool-item tool-item-bar"> </li> <li class="tool-item tool-item-size tool-active tool-QRcode" data-type="article" id="tool-share"> <a class="tool-item-href" href="javascript:;" data-report-click='{"mod":"1582594662_002","spm":"1001.2101.3001.4129","ab":"new"}'> <img class="isdefault" src="https://csdnimg.cn/release/blogv2/dist/pc/img/newShareBlack.png" alt=""> </a> <div class="QRcode" id="tool-QRcode"> <div class="share-bg-icon icon1" id="shareBgIcon"></div> <div class="share-bg-box"> <div class="share-content"> <img class="share-avatar" src="https://profile-avatar.csdnimg.cn/fee2d93356c14cbb93be3c1f39bf1488_qq_18307045.jpg!1" alt=""> <div class="share-tit"> 【HTML入门学习笔记（三）】 </div> <div class="share-dec"> HTML入门学习笔记（三） </div> <a id="copyPosterUrl" class="url" data-report-click='{"spm":"1001.2101.3001.7493"}' data-report-view='{"spm":"1001.2101.3001.7493"}'>复制链接</a> </div> <div class="share-code"> <div class="share-code-box" id='shareCode'></div> <div class="share-code-text">扫一扫</div> </div> </div> <div class="share-code-type"> </div> </div> </li> </ul> </div> <div class="toolbox-right"> <div class="tool-directory"> <a class="bt-columnlist-show" data-id="11760244" data-free="true" data-description="" data-subscribe="false" data-title="学习笔记" data-img="https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64" data-url="https://blog.csdn.net/qq_18307045/category_11760244.html" data-sum="11" data-people="0" data-price="0" data-hotRank="0" data-status="true" data-oldprice="0" data-join="false" data-studyvip="false" data-studysubscribe="false" data-report-view='{"spm":"1001.2101.3001.6334","extend1":"专栏目录"}' data-report-click='{"spm":"1001.2101.3001.6334","extend1":"专栏目录"}'>专栏目录</a> </div> </div> </div> </div> <script type=text/javascript crossorigin src="https://csdnimg.cn/release/phoenix/production/qrcode-7c90a92189.min.js"></script> <script src="//g.csdnimg.cn/??sharewx/1.2.1/sharewx.js" type="text/javascript"></script> <script type="text/javascript" crossorigin src="https://g.csdnimg.cn/common/csdn-login-box/csdn-login-box.js"></script> <script type="text/javascript" crossorigin src="https://g.csdnimg.cn/collection-box/2.1.2/collection-box.js"></script> <div class="first-recommend-box recommend-box "> <div class="recommend-item-box type_blog clearfix" data-url="https://blog.csdn.net/qq_42129553/article/details/109077142" data-report-view='{"ab":"new","spm":"1001.2101.3001.6661.1","mod":"popu_871","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant_t0.none-task-blog-2~default~BlogCommendFromBaidu~PaidSort-1-109077142-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"1","strategy":"2~default~BlogCommendFromBaidu~PaidSort","dest":"https://blog.csdn.net/qq_42129553/article/details/109077142"}'> <div class="content-box"> <div class="content-blog display-flex"> <div class="title-box"> <a href="https://blog.csdn.net/qq_42129553/article/details/109077142" class="tit" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6661.1","mod":"popu_871","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant_t0.none-task-blog-2~default~BlogCommendFromBaidu~PaidSort-1-109077142-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"1","strategy":"2~default~BlogCommendFromBaidu~PaidSort","dest":"https://blog.csdn.net/qq_42129553/article/details/109077142"}' data-report-query='spm=1001.2101.3001.6661.1&utm_medium=distribute.pc_relevant_t0.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7EPaidSort-1-109077142-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant_t0.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7EPaidSort-1-109077142-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="left ellipsis-online ellipsis-online-1">vue的重点11:文本输入框的提示颜色、复选框的样式设置、旋转对块级元素或者行内块元素有效，对行内元素无效</div> </a> </div> <div class="info-box display-flex"> <div class="info"> <a href="https://blog.csdn.net/qq_42129553" target="_blank"><span class="blog-title">小黄呀呀呀的博客</span></a> </div> <div class="info display-flex"> <span class="info-block time">10-14</span> <span class="info-block read"><img class="read-img" src="https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png" alt=""> 541 </span> </div> </div> </div> <div class="desc-box"> <a href="https://blog.csdn.net/qq_42129553/article/details/109077142" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6661.1","mod":"popu_871","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant_t0.none-task-blog-2~default~BlogCommendFromBaidu~PaidSort-1-109077142-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"1","strategy":"2~default~BlogCommendFromBaidu~PaidSort","dest":"https://blog.csdn.net/qq_42129553/article/details/109077142"}' data-report-query='spm=1001.2101.3001.6661.1&utm_medium=distribute.pc_relevant_t0.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7EPaidSort-1-109077142-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant_t0.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7EPaidSort-1-109077142-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="desc ellipsis-online ellipsis-online-1">1、文本输入框的提示颜色 input::-webkit-input-placeholder { /* WebKit browsers */ color: #ccc; } 2、复选框的样式设置 input[type="checkbox"] { width: 1.64rem; height: 1.64rem; display: inline-block; text-align: center; vertical-align: baseline; </div> </a> </div> </div> </div> </div> <script src="https://csdnimg.cn/release/blogv2/dist/components/js/pc_wap_commontools-9d6d0707b4.min.js" type="text/javascript" async></script> <div class="second-recommend-box recommend-box "> <div class="recommend-item-box type_blog clearfix" data-url="https://blog.csdn.net/weixin_44554456/article/details/103558296" data-report-view='{"ab":"new","spm":"1001.2101.3001.6650.1","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-1-103558296-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"1","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/weixin_44554456/article/details/103558296"}'> <div class="content-box"> <div class="content-blog display-flex"> <div class="title-box"> <a href="https://blog.csdn.net/weixin_44554456/article/details/103558296" class="tit" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.1","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-1-103558296-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"1","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/weixin_44554456/article/details/103558296"}' data-report-query='spm=1001.2101.3001.6650.1&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-1-103558296-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-1-103558296-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="left ellipsis-online ellipsis-online-1"><em>HTML</em> ＜div＞和＜span＞</div> </a> </div> <div class="info-box display-flex"> <div class="info"> <a href="https://blog.csdn.net/weixin_44554456" target="_blank"><span class="blog-title">木晓的博客</span></a> </div> <div class="info display-flex"> <span class="info-block time">12-16</span> <span class="info-block read"><img class="read-img" src="https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png" alt=""> 86 </span> </div> </div> </div> <div class="desc-box"> <a href="https://blog.csdn.net/weixin_44554456/article/details/103558296" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.1","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-1-103558296-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"1","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/weixin_44554456/article/details/103558296"}' data-report-query='spm=1001.2101.3001.6650.1&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-1-103558296-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-1-103558296-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="desc ellipsis-online ellipsis-online-1">可以通过和将 <em>HTML</em> 元素组合起来。 <em>HTML</em> 块元素大多数 <em>HTML</em> 元素被定义为块级元素或内联元素。编者注：“块级元素”译为 block level element，“内联元素”译为 inline element。块级元素在浏览器显示时，通常会以新行来开始（和结束）。例子： <h1>, <p>, <ul>, <table> H...</div> </a> </div> </div> </div> </div> <a id="commentBox" name="commentBox"></a> <div id="pcCommentBox" class="comment-box comment-box-new2 unlogin-comment-box-new" style="display:none"> <div class="unlogin-comment-model"> <span class="unlogin-comment-tit">参与评论</span> <span class="unlogin-comment-text">您还未登录，请先</span> <span class="unlogin-comment-bt">登录</span> <span class="unlogin-comment-text">后发表或查看评论</span> </div> </div> <div class="recommend-box insert-baidu-box recommend-box-style "> <div class="recommend-item-box no-index" style="display:none"></div> <div class="recommend-item-box type_blog clearfix" data-url="https://blog.csdn.net/weixin_72322475/article/details/125689971" data-report-view='{"ab":"new","spm":"1001.2101.3001.6650.2","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-2-125689971-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"2","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/weixin_72322475/article/details/125689971"}'> <div class="content-box"> <div class="content-blog display-flex"> <div class="title-box"> <a href="https://blog.csdn.net/weixin_72322475/article/details/125689971" class="tit" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.2","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-2-125689971-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"2","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/weixin_72322475/article/details/125689971"}' data-report-query='spm=1001.2101.3001.6650.2&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-2-125689971-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-2-125689971-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="left ellipsis-online ellipsis-online-1">行内元素，块元素，行内块元素有哪些及其特征（总结整理自b站黑马pink老师的课程）</div> </a> </div> <div class="info-box display-flex"> <div class="info"> <a href="https://blog.csdn.net/weixin_72322475" target="_blank"><span class="blog-title">weixin_72322475的博客</span></a> </div> <div class="info display-flex"> <span class="info-block time">07-09</span> <span class="info-block read"><img class="read-img" src="https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png" alt=""> 431 </span> </div> </div> </div> <div class="desc-box"> <a href="https://blog.csdn.net/weixin_72322475/article/details/125689971" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.2","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-2-125689971-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"2","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/weixin_72322475/article/details/125689971"}' data-report-query='spm=1001.2101.3001.6650.2&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-2-125689971-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-2-125689971-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="desc ellipsis-online ellipsis-online-1">总结行内元素，块元素，行内块元素有哪些及其特征</div> </a> </div> </div> </div> <div class="recommend-item-box type_blog clearfix" data-url="https://blog.csdn.net/qq_21353273/article/details/128175509" data-report-view='{"ab":"new","spm":"1001.2101.3001.6650.3","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-3-128175509-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"3","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/qq_21353273/article/details/128175509"}'> <div class="content-box"> <div class="content-blog display-flex"> <div class="title-box"> <a href="https://blog.csdn.net/qq_21353273/article/details/128175509" class="tit" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.3","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-3-128175509-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"3","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/qq_21353273/article/details/128175509"}' data-report-query='spm=1001.2101.3001.6650.3&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-3-128175509-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-3-128175509-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="left ellipsis-online ellipsis-online-1">复习前端知识(<em>HTML</em>)</div> </a> </div> <div class="info-box display-flex"> <div class="info"> <a href="https://blog.csdn.net/qq_21353273" target="_blank"><span class="blog-title">qq_21353273的博客</span></a> </div> <div class="info display-flex"> <span class="info-block time">12-14</span> <span class="info-block read"><img class="read-img" src="https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png" alt=""> 310 </span> </div> </div> </div> <div class="desc-box"> <a href="https://blog.csdn.net/qq_21353273/article/details/128175509" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.3","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-3-128175509-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"3","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/qq_21353273/article/details/128175509"}' data-report-query='spm=1001.2101.3001.6650.3&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-3-128175509-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-3-128175509-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="desc ellipsis-online ellipsis-online-1">前端<em>学习</em>学了忘，忘了学，知识点学的一地稀碎。最近准备对现在掌握的知识点进行梳理并整理，用于帮助自己记忆。如果有什么地方写的有错误或者有遗漏的地方，欢迎大家指正。</div> </a> </div> </div> </div> <dl id="recommend-item-box-tow" class="recommend-item-box type_blog clearfix"> </dl> <div class="recommend-item-box type_blog clearfix" data-url="https://blog.csdn.net/weixin_43415644/article/details/87898970" data-report-view='{"ab":"new","spm":"1001.2101.3001.6650.4","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-4-87898970-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"4","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/weixin_43415644/article/details/87898970"}'> <div class="content-box"> <div class="content-blog display-flex"> <div class="title-box"> <a href="https://blog.csdn.net/weixin_43415644/article/details/87898970" class="tit" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.4","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-4-87898970-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"4","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/weixin_43415644/article/details/87898970"}' data-report-query='spm=1001.2101.3001.6650.4&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-4-87898970-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-4-87898970-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="left ellipsis-online ellipsis-online-1"><em>HTML</em>Day02：表单，行内元素，块级元素，行内块元素之间的区别、inline/inline-block/block</div> </a> </div> <div class="info-box display-flex"> <div class="info"> <a href="https://blog.csdn.net/weixin_43415644" target="_blank"><span class="blog-title">坚持硬核</span></a> </div> <div class="info display-flex"> <span class="info-block time">02-24</span> <span class="info-block read"><img class="read-img" src="https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png" alt=""> 455 </span> </div> </div> </div> <div class="desc-box"> <a href="https://blog.csdn.net/weixin_43415644/article/details/87898970" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.4","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-4-87898970-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"4","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/weixin_43415644/article/details/87898970"}' data-report-query='spm=1001.2101.3001.6650.4&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-4-87898970-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-4-87898970-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="desc ellipsis-online ellipsis-online-1">目录 0x00重量级元素之表单： 0x01 给标签元素一个命名，让程序容易找到 0x02 行内元素，块级元素和行内块级元素的区别（重点，面试笔试必问） 0x03inline/inline-block/block 0x00重量级元素之表单：收集用户输入，发送或者提交给服务器。一般情况下只有表单才有向服务器提交内容的功能。使用方式如下例子： <form method='传送方式'...</div> </a> </div> </div> </div> <div class="recommend-item-box type_blog clearfix" data-url="https://blog.csdn.net/weixin_30851867/article/details/98268118" data-report-view='{"ab":"new","spm":"1001.2101.3001.6650.5","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-5-98268118-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"5","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/weixin_30851867/article/details/98268118"}'> <div class="content-box"> <div class="content-blog display-flex"> <div class="title-box"> <a href="https://blog.csdn.net/weixin_30851867/article/details/98268118" class="tit" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.5","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-5-98268118-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"5","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/weixin_30851867/article/details/98268118"}' data-report-query='spm=1001.2101.3001.6650.5&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-5-98268118-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-5-98268118-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="left ellipsis-online ellipsis-online-1"><em>HTML</em>哪些是块级元素，哪些是行内元素、</div> </a> </div> <div class="info-box display-flex"> <div class="info"> <a href="https://blog.csdn.net/weixin_30851867" target="_blank"><span class="blog-title">weixin_30851867的博客</span></a> </div> <div class="info display-flex"> <span class="info-block time">10-14</span> <span class="info-block read"><img class="read-img" src="https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png" alt=""> 224 </span> </div> </div> </div> <div class="desc-box"> <a href="https://blog.csdn.net/weixin_30851867/article/details/98268118" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.5","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-5-98268118-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"5","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/weixin_30851867/article/details/98268118"}' data-report-query='spm=1001.2101.3001.6650.5&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-5-98268118-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-5-98268118-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="desc ellipsis-online ellipsis-online-1">块级元素：块级大多为结构性标记 <address>...</adderss> <center>...</center> 地址文字 <h1>...</h1> 标题一级 <h2>...</h2> 标题二级 <h3>...</h3> 标题<em>三</em>级...</div> </a> </div> </div> </div> <div class="recommend-item-box type_blog clearfix" data-url="https://blog.csdn.net/hao2ik/article/details/118579713" data-report-view='{"ab":"new","spm":"1001.2101.3001.6650.6","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~VECTOR_VIP~Rate-6-118579713-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"6","strategy":"2~default~VECTOR_VIP~Rate","dest":"https://blog.csdn.net/hao2ik/article/details/118579713"}'> <div class="content-box"> <div class="content-blog display-flex"> <div class="title-box"> <a href="https://blog.csdn.net/hao2ik/article/details/118579713" class="tit" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.6","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~VECTOR_VIP~Rate-6-118579713-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"6","strategy":"2~default~VECTOR_VIP~Rate","dest":"https://blog.csdn.net/hao2ik/article/details/118579713"}' data-report-query='spm=1001.2101.3001.6650.6&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EVECTOR_VIP%7ERate-6-118579713-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EVECTOR_VIP%7ERate-6-118579713-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="left ellipsis-online ellipsis-online-1"><em>HTML</em> <em>学习</em><em>笔记</em>（1）</div> </a> </div> <div class="info-box display-flex"> <div class="info"> <a href="https://blog.csdn.net/hao2ik" target="_blank"><span class="blog-title">hao2ik的博客</span></a> </div> <div class="info display-flex"> <span class="info-block time">07-08</span> <span class="info-block read"><img class="read-img" src="https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png" alt=""> 114 </span> </div> </div> </div> <div class="desc-box"> <a href="https://blog.csdn.net/hao2ik/article/details/118579713" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.6","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~VECTOR_VIP~Rate-6-118579713-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"6","strategy":"2~default~VECTOR_VIP~Rate","dest":"https://blog.csdn.net/hao2ik/article/details/118579713"}' data-report-query='spm=1001.2101.3001.6650.6&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EVECTOR_VIP%7ERate-6-118579713-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EVECTOR_VIP%7ERate-6-118579713-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="desc ellipsis-online ellipsis-online-1">一、<em>html</em>标签换行：<br /> 空格： （utf8编码，3个空格代表一个汉字）标题标签：<h1></h1> 一共有6个标题标签h1-h6 段落标签：<p></p> 弱语义：<b></b>加粗 <s></s>删除线 <i></i>倾斜强语义：<strong></strong>加粗 <del></..</div> </a> </div> </div> </div> <div class="recommend-item-box type_blog clearfix" data-url="https://blog.csdn.net/weixin_39474188/article/details/116645900" data-report-view='{"ab":"new","spm":"1001.2101.3001.6650.7","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~VECTOR_VIP~Rate-7-116645900-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"7","strategy":"2~default~VECTOR_VIP~Rate","dest":"https://blog.csdn.net/weixin_39474188/article/details/116645900"}'> <div class="content-box"> <div class="content-blog display-flex"> <div class="title-box"> <a href="https://blog.csdn.net/weixin_39474188/article/details/116645900" class="tit" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.7","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~VECTOR_VIP~Rate-7-116645900-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"7","strategy":"2~default~VECTOR_VIP~Rate","dest":"https://blog.csdn.net/weixin_39474188/article/details/116645900"}' data-report-query='spm=1001.2101.3001.6650.7&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EVECTOR_VIP%7ERate-7-116645900-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EVECTOR_VIP%7ERate-7-116645900-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="left ellipsis-online ellipsis-online-1"><em>html</em><em>入门</em><em>笔记</em>1</div> </a> </div> <div class="info-box display-flex"> <div class="info"> <a href="https://blog.csdn.net/weixin_39474188" target="_blank"><span class="blog-title">weixin_39474188的博客</span></a> </div> <div class="info display-flex"> <span class="info-block time">05-11</span> <span class="info-block read"><img class="read-img" src="https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png" alt=""> 95 </span> </div> </div> </div> <div class="desc-box"> <a href="https://blog.csdn.net/weixin_39474188/article/details/116645900" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.7","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~VECTOR_VIP~Rate-7-116645900-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"7","strategy":"2~default~VECTOR_VIP~Rate","dest":"https://blog.csdn.net/weixin_39474188/article/details/116645900"}' data-report-query='spm=1001.2101.3001.6650.7&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EVECTOR_VIP%7ERate-7-116645900-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EVECTOR_VIP%7ERate-7-116645900-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="desc ellipsis-online ellipsis-online-1">文章目录1. <em>html</em>简介2. <em>html</em>起手3. 常用的表示章节的标签4. 全局属性5. 常用的内容标签6. 列表元素 1. <em>html</em>简介 <em>HTML</em>，全称为HyperText Markup Language（超文本标记语言），是一种用于创建网页的标准标记语言，于1990由英国人Sir Timothy John Berners-Lee（李伯纳，李爵士）发明，并同时编辑了第一个网络服务器。要写学会前端开发，学好<em>html</em>是第一步。 2. <em>html</em>起手 <!DOCTYPE <em>html</em>> <<em>html</em></div> </a> </div> </div> </div> <div class="recommend-item-box type_download clearfix" data-url="https://download.csdn.net/download/m0_73662179/88779275" data-report-view='{"ab":"new","spm":"1001.2101.3001.6650.8","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-download-2~default~OPENSEARCH~Rate-8-88779275-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"8","strategy":"2~default~OPENSEARCH~Rate","dest":"https://download.csdn.net/download/m0_73662179/88779275"}'> <div class="content-box"> <div class="content-blog display-flex"> <div class="title-box"> <a href="https://download.csdn.net/download/m0_73662179/88779275" class="tit" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.8","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-download-2~default~OPENSEARCH~Rate-8-88779275-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"8","strategy":"2~default~OPENSEARCH~Rate","dest":"https://download.csdn.net/download/m0_73662179/88779275"}' data-report-query='spm=1001.2101.3001.6650.8&utm_medium=distribute.pc_relevant.none-task-download-2%7Edefault%7EOPENSEARCH%7ERate-8-88779275-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-download-2%7Edefault%7EOPENSEARCH%7ERate-8-88779275-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="left ellipsis-online ellipsis-online-1"><em>html</em>+css<em>入门</em><em>学习</em><em>笔记</em></div> <div class="tag">最新发布</div> </a> </div> <div class="info-box display-flex"> <div class="info display-flex"> <span class="info-block">01-24</span> </div> </div> </div> <div class="desc-box"> <a href="https://download.csdn.net/download/m0_73662179/88779275" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.8","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-download-2~default~OPENSEARCH~Rate-8-88779275-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"8","strategy":"2~default~OPENSEARCH~Rate","dest":"https://download.csdn.net/download/m0_73662179/88779275"}' data-report-query='spm=1001.2101.3001.6650.8&utm_medium=distribute.pc_relevant.none-task-download-2%7Edefault%7EOPENSEARCH%7ERate-8-88779275-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-download-2%7Edefault%7EOPENSEARCH%7ERate-8-88779275-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="desc ellipsis-online ellipsis-online-1">本<em>入门</em><em>学习</em><em>笔记</em>将帮助初学者理解这两门技术的基本概念，逐步掌握创建动态、美观网页的方法。 <em>HTML</em>是用于创建网页内容的语言，它通过一系列标签来定义网页的各个部分，如标题、段落、图片、链接等。在<em>HTML</em>5中，新增...</div> </a> </div> </div> </div> <div class="recommend-item-box type_download clearfix" data-url="https://download.csdn.net/download/lijunhcn/88687186" data-report-view='{"ab":"new","spm":"1001.2101.3001.6650.9","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-download-2~default~OPENSEARCH~Rate-9-88687186-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"9","strategy":"2~default~OPENSEARCH~Rate","dest":"https://download.csdn.net/download/lijunhcn/88687186"}'> <div class="content-box"> <div class="content-blog display-flex"> <div class="title-box"> <a href="https://download.csdn.net/download/lijunhcn/88687186" class="tit" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.9","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-download-2~default~OPENSEARCH~Rate-9-88687186-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"9","strategy":"2~default~OPENSEARCH~Rate","dest":"https://download.csdn.net/download/lijunhcn/88687186"}' data-report-query='spm=1001.2101.3001.6650.9&utm_medium=distribute.pc_relevant.none-task-download-2%7Edefault%7EOPENSEARCH%7ERate-9-88687186-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-download-2%7Edefault%7EOPENSEARCH%7ERate-9-88687186-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="left ellipsis-online ellipsis-online-1"><em>HTML</em><em>入门</em><em>学习</em>及<em>笔记</em>.zip</div> </a> </div> <div class="info-box display-flex"> <div class="info display-flex"> <span class="info-block">01-01</span> </div> </div> </div> <div class="desc-box"> <a href="https://download.csdn.net/download/lijunhcn/88687186" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.9","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-download-2~default~OPENSEARCH~Rate-9-88687186-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"9","strategy":"2~default~OPENSEARCH~Rate","dest":"https://download.csdn.net/download/lijunhcn/88687186"}' data-report-query='spm=1001.2101.3001.6650.9&utm_medium=distribute.pc_relevant.none-task-download-2%7Edefault%7EOPENSEARCH%7ERate-9-88687186-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-download-2%7Edefault%7EOPENSEARCH%7ERate-9-88687186-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="desc ellipsis-online ellipsis-online-1"><em>HTML</em><em>入门</em><em>学习</em>及<em>笔记</em><em>HTML</em><em>入门</em><em>学习</em>及<em>笔记</em><em>HTML</em><em>入门</em><em>学习</em>及<em>笔记</em><em>HTML</em><em>入门</em><em>学习</em>及<em>笔记</em> <em>HTML</em><em>入门</em><em>学习</em>及<em>笔记</em><em>HTML</em><em>入门</em><em>学习</em>及<em>笔记</em><em>HTML</em><em>入门</em><em>学习</em>及<em>笔记</em><em>HTML</em><em>入门</em><em>学习</em>及<em>笔记</em> <em>HTML</em><em>入门</em><em>学习</em>及<em>笔记</em><em>HTML</em><em>入门</em><em>学习</em>及<em>笔记</em><em>HTML</em><em>入门</em><em>学习</em>及<em>笔记</em>...</div> </a> </div> </div> </div> <div class="recommend-item-box type_download clearfix" data-url="https://download.csdn.net/download/asdfghjyu/12188382" data-report-view='{"ab":"new","spm":"1001.2101.3001.6650.10","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-download-2~default~OPENSEARCH~Rate-10-12188382-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"10","strategy":"2~default~OPENSEARCH~Rate","dest":"https://download.csdn.net/download/asdfghjyu/12188382"}'> <div class="content-box"> <div class="content-blog display-flex"> <div class="title-box"> <a href="https://download.csdn.net/download/asdfghjyu/12188382" class="tit" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.10","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-download-2~default~OPENSEARCH~Rate-10-12188382-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"10","strategy":"2~default~OPENSEARCH~Rate","dest":"https://download.csdn.net/download/asdfghjyu/12188382"}' data-report-query='spm=1001.2101.3001.6650.10&utm_medium=distribute.pc_relevant.none-task-download-2%7Edefault%7EOPENSEARCH%7ERate-10-12188382-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-download-2%7Edefault%7EOPENSEARCH%7ERate-10-12188382-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="left ellipsis-online ellipsis-online-1"><em>HTML</em><em>入门</em><em>学习</em><em>笔记</em>.md</div> </a> </div> <div class="info-box display-flex"> <div class="info display-flex"> <span class="info-block">02-24</span> </div> </div> </div> <div class="desc-box"> <a href="https://download.csdn.net/download/asdfghjyu/12188382" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.10","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-download-2~default~OPENSEARCH~Rate-10-12188382-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"10","strategy":"2~default~OPENSEARCH~Rate","dest":"https://download.csdn.net/download/asdfghjyu/12188382"}' data-report-query='spm=1001.2101.3001.6650.10&utm_medium=distribute.pc_relevant.none-task-download-2%7Edefault%7EOPENSEARCH%7ERate-10-12188382-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-download-2%7Edefault%7EOPENSEARCH%7ERate-10-12188382-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="desc ellipsis-online ellipsis-online-1">超文本标记语言（Hyper Text Markup Language），缩写为<em>HTML</em>，标准通用标记语言下的一个应用。<em>HTML</em>不是一种编程语言，而是一种标记语言（markup language），是网页制作所必备的工具。“超文本”就是指页面内可以...</div> </a> </div> </div> </div> <div class="recommend-item-box type_download clearfix" data-url="https://download.csdn.net/download/weixin_38659646/13069753" data-report-view='{"ab":"new","spm":"1001.2101.3001.6650.11","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-download-2~default~OPENSEARCH~Rate-11-13069753-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"11","strategy":"2~default~OPENSEARCH~Rate","dest":"https://download.csdn.net/download/weixin_38659646/13069753"}'> <div class="content-box"> <div class="content-blog display-flex"> <div class="title-box"> <a href="https://download.csdn.net/download/weixin_38659646/13069753" class="tit" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.11","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-download-2~default~OPENSEARCH~Rate-11-13069753-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"11","strategy":"2~default~OPENSEARCH~Rate","dest":"https://download.csdn.net/download/weixin_38659646/13069753"}' data-report-query='spm=1001.2101.3001.6650.11&utm_medium=distribute.pc_relevant.none-task-download-2%7Edefault%7EOPENSEARCH%7ERate-11-13069753-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-download-2%7Edefault%7EOPENSEARCH%7ERate-11-13069753-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="left ellipsis-online ellipsis-online-1">json <em>入门</em><em>学习</em><em>笔记</em> 示例代码</div> </a> </div> <div class="info-box display-flex"> <div class="info display-flex"> <span class="info-block">10-29</span> </div> </div> </div> <div class="desc-box"> <a href="https://download.csdn.net/download/weixin_38659646/13069753" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.11","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-download-2~default~OPENSEARCH~Rate-11-13069753-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"11","strategy":"2~default~OPENSEARCH~Rate","dest":"https://download.csdn.net/download/weixin_38659646/13069753"}' data-report-query='spm=1001.2101.3001.6650.11&utm_medium=distribute.pc_relevant.none-task-download-2%7Edefault%7EOPENSEARCH%7ERate-11-13069753-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-download-2%7Edefault%7EOPENSEARCH%7ERate-11-13069753-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="desc ellipsis-online ellipsis-online-1">同时，我们也<em>学习</em>了在.NET环境下如何利用***库对对象进行序列化和反序列化，这是.NET开发中处理JSON数据的常见方式之一。掌握这些知识点，将有助于在进行Web开发或其他需要数据交换的场景中，有效地使用JSON格式处理...</div> </a> </div> </div> </div> <div class="recommend-item-box type_blog clearfix" data-url="https://blog.csdn.net/SR2017/article/details/69729783" data-report-view='{"ab":"new","spm":"1001.2101.3001.6650.12","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-12-69729783-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"12","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/SR2017/article/details/69729783"}'> <div class="content-box"> <div class="content-blog display-flex"> <div class="title-box"> <a href="https://blog.csdn.net/SR2017/article/details/69729783" class="tit" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.12","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-12-69729783-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"12","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/SR2017/article/details/69729783"}' data-report-query='spm=1001.2101.3001.6650.12&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-12-69729783-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-12-69729783-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="left ellipsis-online ellipsis-online-1">关于input标签checkbox属性和checked</div> <div class="tag">热门推荐</div> </a> </div> <div class="info-box display-flex"> <div class="info"> <a href="https://blog.csdn.net/SR2017" target="_blank"><span class="blog-title">SR2017的专栏</span></a> </div> <div class="info display-flex"> <span class="info-block time">04-08</span> <span class="info-block read"><img class="read-img" src="https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png" alt=""> 1万+ </span> </div> </div> </div> <div class="desc-box"> <a href="https://blog.csdn.net/SR2017/article/details/69729783" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.12","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-12-69729783-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"12","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/SR2017/article/details/69729783"}' data-report-query='spm=1001.2101.3001.6650.12&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-12-69729783-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-12-69729783-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="desc ellipsis-online ellipsis-online-1">我们设置了type的属性为checkbox时，记住以下3个关键点 1.点勾选时或者说点击时，checked为选中，在input标签中是checked=“checked”，注意这里面无论checked=“这里面写什么都是已选中”；checked只是个attribute属性， 2，选中还是未选中checkbox会返回一个Boolean 选中 true，未选中false 3.注意选中的</div> </a> </div> </div> </div> <div class="recommend-item-box type_blog clearfix" data-url="https://blog.csdn.net/lxr_99/article/details/117392809" data-report-view='{"ab":"new","spm":"1001.2101.3001.6650.13","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-13-117392809-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"13","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/lxr_99/article/details/117392809"}'> <div class="content-box"> <div class="content-blog display-flex"> <div class="title-box"> <a href="https://blog.csdn.net/lxr_99/article/details/117392809" class="tit" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.13","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-13-117392809-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"13","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/lxr_99/article/details/117392809"}' data-report-query='spm=1001.2101.3001.6650.13&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-13-117392809-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-13-117392809-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="left ellipsis-online ellipsis-online-1">form表单</div> </a> </div> <div class="info-box display-flex"> <div class="info"> <a href="https://blog.csdn.net/lxr_99" target="_blank"><span class="blog-title">lxr_99的博客</span></a> </div> <div class="info display-flex"> <span class="info-block time">05-30</span> <span class="info-block read"><img class="read-img" src="https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png" alt=""> 510 </span> </div> </div> </div> <div class="desc-box"> <a href="https://blog.csdn.net/lxr_99/article/details/117392809" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.13","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-13-117392809-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"13","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/lxr_99/article/details/117392809"}' data-report-query='spm=1001.2101.3001.6650.13&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-13-117392809-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-13-117392809-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="desc ellipsis-online ellipsis-online-1">一：概念 <form>标签用于创建<em>HTML</em>表单 form元素是块级元素，它的前后会拆行表单用于向服务器传输数据，action指定向何处发送表单数据表单可包含input、lable、textarea、select 二：表单中可包含input标签 type属性含义 text 文本框(单行) passward 密码框 submit 提交按钮 radio 单选按钮 checkbox 多选按钮 button 普通按钮 </div> </a> </div> </div> </div> <div class="recommend-item-box type_blog clearfix" data-url="https://blog.csdn.net/ENDEAVOR__/article/details/108714150" data-report-view='{"ab":"new","spm":"1001.2101.3001.6650.14","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-14-108714150-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"14","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/ENDEAVOR__/article/details/108714150"}'> <div class="content-box"> <div class="content-blog display-flex"> <div class="title-box"> <a href="https://blog.csdn.net/ENDEAVOR__/article/details/108714150" class="tit" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.14","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-14-108714150-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"14","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/ENDEAVOR__/article/details/108714150"}' data-report-query='spm=1001.2101.3001.6650.14&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-14-108714150-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-14-108714150-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="left ellipsis-online ellipsis-online-1">使div具有内联元素的特性</div> </a> </div> <div class="info-box display-flex"> <div class="info"> <a href="https://blog.csdn.net/ENDEAVOR__" target="_blank"><span class="blog-title">你难忘的</span></a> </div> <div class="info display-flex"> <span class="info-block time">09-21</span> <span class="info-block read"><img class="read-img" src="https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png" alt=""> 580 </span> </div> </div> </div> <div class="desc-box"> <a href="https://blog.csdn.net/ENDEAVOR__/article/details/108714150" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.14","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-14-108714150-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"14","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/ENDEAVOR__/article/details/108714150"}' data-report-query='spm=1001.2101.3001.6650.14&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-14-108714150-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-14-108714150-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="desc ellipsis-online ellipsis-online-1">div{ display:inline; } ...... <div>我要变成内联元素</div> <!DOCTYPE <em>html</em>> <<em>html</em>> <head> <meta charset="utf-8"> <title></title> <style> div{ display:inline; } </style> </hea.</div> </a> </div> </div> </div> <div class="recommend-item-box type_blog clearfix" data-url="https://blog.csdn.net/qq_36344771/article/details/84562889" data-report-view='{"ab":"new","spm":"1001.2101.3001.6650.15","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-15-84562889-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"15","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/qq_36344771/article/details/84562889"}'> <div class="content-box"> <div class="content-blog display-flex"> <div class="title-box"> <a href="https://blog.csdn.net/qq_36344771/article/details/84562889" class="tit" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.15","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-15-84562889-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"15","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/qq_36344771/article/details/84562889"}' data-report-query='spm=1001.2101.3001.6650.15&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-15-84562889-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-15-84562889-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="left ellipsis-online ellipsis-online-1">20181127——<em>Html</em>中的行内元素与块级元素</div> </a> </div> <div class="info-box display-flex"> <div class="info"> <a href="https://blog.csdn.net/qq_36344771" target="_blank"><span class="blog-title">寄蜉蝣于天地，渺沧海之一粟。</span></a> </div> <div class="info display-flex"> <span class="info-block time">11-27</span> <span class="info-block read"><img class="read-img" src="https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png" alt=""> 172 </span> </div> </div> </div> <div class="desc-box"> <a href="https://blog.csdn.net/qq_36344771/article/details/84562889" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.15","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-15-84562889-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"15","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/qq_36344771/article/details/84562889"}' data-report-query='spm=1001.2101.3001.6650.15&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-15-84562889-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-15-84562889-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="desc ellipsis-online ellipsis-online-1">块级元素：块级大多为结构性标记 <address>...</adderss> <center>...</center> 地址文字 <h1>...</h1> 标题一级 <h2>...</h2> 标题二级 <h3>...&a</div> </a> </div> </div> </div> <div class="recommend-item-box type_blog clearfix" data-url="https://blog.csdn.net/weixin_39647773/article/details/117937702" data-report-view='{"ab":"new","spm":"1001.2101.3001.6650.16","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-16-117937702-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"16","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/weixin_39647773/article/details/117937702"}'> <div class="content-box"> <div class="content-blog display-flex"> <div class="title-box"> <a href="https://blog.csdn.net/weixin_39647773/article/details/117937702" class="tit" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.16","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-16-117937702-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"16","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/weixin_39647773/article/details/117937702"}' data-report-query='spm=1001.2101.3001.6650.16&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-16-117937702-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-16-117937702-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="left ellipsis-online ellipsis-online-1">在<em>html</em>中列表是块元素还是,<em>HTML</em>基础知识4-列表及表单的写法、块级元素和内联（行内）元素的区别...</div> </a> </div> <div class="info-box display-flex"> <div class="info"> <a href="https://blog.csdn.net/weixin_39647773" target="_blank"><span class="blog-title">weixin_39647773的博客</span></a> </div> <div class="info display-flex"> <span class="info-block time">06-15</span> <span class="info-block read"><img class="read-img" src="https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png" alt=""> 724 </span> </div> </div> </div> <div class="desc-box"> <a href="https://blog.csdn.net/weixin_39647773/article/details/117937702" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.16","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromBaidu~Rate-16-117937702-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"16","strategy":"2~default~BlogCommendFromBaidu~Rate","dest":"https://blog.csdn.net/weixin_39647773/article/details/117937702"}' data-report-query='spm=1001.2101.3001.6650.16&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-16-117937702-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-16-117937702-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="desc ellipsis-online ellipsis-online-1">一、有序列表、无序列表、自定义列表如何使用？写个简单的例子。<em>三</em>者在语义上有什么区别？在哪些情况下使用哪种(重要)？如何嵌套？1、简单例子如下：Documentdiv.div1{background-color:#bbb;color: red;}div.div2{background-color:#ccc;color: green;}div.div3{background-color:#ddd;c...</div> </a> </div> </div> </div> <div class="recommend-item-box type_c_download clearfix" data-url="https://wenku.csdn.net/doc/1hg743f3cp" data-report-view='{"ab":"new","spm":"1001.2101.3001.6650.17","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-c_download-2~default~OPENSEARCH~Position-17-1hg743f3cp-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"17","strategy":"2~default~OPENSEARCH~Position","dest":"https://wenku.csdn.net/doc/1hg743f3cp"}'> <div class="content-box"> <div class="content-blog display-flex"> <div class="title-box"> <a href="https://wenku.csdn.net/doc/1hg743f3cp" class="tit" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.17","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-c_download-2~default~OPENSEARCH~Position-17-1hg743f3cp-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"17","strategy":"2~default~OPENSEARCH~Position","dest":"https://wenku.csdn.net/doc/1hg743f3cp"}' data-report-query='spm=1001.2101.3001.6650.17&utm_medium=distribute.pc_relevant.none-task-c_download-2%7Edefault%7EOPENSEARCH%7EPosition-17-1hg743f3cp-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-c_download-2%7Edefault%7EOPENSEARCH%7EPosition-17-1hg743f3cp-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="left ellipsis-online ellipsis-online-1"><em>HTML</em><em>入门</em>：<em>学习</em><em>笔记</em>与基础知识</div> </a> </div> <div class="info-box display-flex"> <div class="info display-flex"> <span class="info-block"></span> </div> </div> </div> <div class="desc-box"> <a href="https://wenku.csdn.net/doc/1hg743f3cp" target="_blank" data-report-click='{"ab":"new","spm":"1001.2101.3001.6650.17","mod":"popu_387","extra":"{\"highlightScore\":0.0,\"utm_medium\":\"distribute.pc_relevant.none-task-c_download-2~default~OPENSEARCH~Position-17-1hg743f3cp-blog-124436486.235^v43^pc_blog_bottom_relevance_base6\",\"dist_request_id\":\"1723994188467_29585\"}","dist_request_id":"1723994188467_29585","ab_strategy":"vector_vip_v1","index":"17","strategy":"2~default~OPENSEARCH~Position","dest":"https://wenku.csdn.net/doc/1hg743f3cp"}' data-report-query='spm=1001.2101.3001.6650.17&utm_medium=distribute.pc_relevant.none-task-c_download-2%7Edefault%7EOPENSEARCH%7EPosition-17-1hg743f3cp-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6&depth_1-utm_source=distribute.pc_relevant.none-task-c_download-2%7Edefault%7EOPENSEARCH%7EPosition-17-1hg743f3cp-blog-124436486.235%5Ev43%5Epc_blog_bottom_relevance_base6'> <div class="desc ellipsis-online ellipsis-online-1">"这篇博客是作者的<em>HTML</em><em>学习</em><em>笔记</em>，主要介绍了<em>HTML</em>的基础标签和表单元素，包括段落、字体、特殊格式化标签以及表单的相关属性。" 在<em>HTML</em>的<em>学习</em>过程中，作者意识到<em>HTML</em>不仅仅是编程，更像是一种表达和设计的工具。通过...</div> </a> </div> </div> </div> </div> <div class="blog-footer-bottom" style="margin-top:10px;"></div> <script src="https://g.csdnimg.cn/common/csdn-footer/csdn-footer.js" data-isfootertrack="false" type="text/javascript"></script> <script type="text/javascript"> window.csdn.csdnFooter.options = { el: '.blog-footer-bottom', type: 2 } </script> </main> <aside class="blog_container_aside"> <div id="asideProfile" class="aside-box"> <div class="profile-intro d-flex"> <div class="avatar-box d-flex justify-content-center flex-column"> <a href="https://blog.csdn.net/qq_18307045" target="_blank" data-report-click='{"mod":"popu_379","spm":"1001.2101.3001.4121","dest":"https://blog.csdn.net/qq_18307045","ab":"new"}'> <img src="https://profile-avatar.csdnimg.cn/fee2d93356c14cbb93be3c1f39bf1488_qq_18307045.jpg!1" class="avatar_pic"> </a> </div> <div class="user-info d-flex flex-column profile-intro-name-box"> <div class="profile-intro-name-boxTop"> <a href="https://blog.csdn.net/qq_18307045" target="_blank" class="" id="uid" title="qq_18307045" data-report-click='{"mod":"popu_379","spm":"1001.2101.3001.4122","dest":"https://blog.csdn.net/qq_18307045","ab":"new"}'> <span class="name " username="qq_18307045">qq_18307045</span> </a> <span> </span> <span class="flag expert-blog"> <span class="bubble">CSDN认证博客专家</span> </span> <span class="flag company-blog"> <span class="bubble">CSDN认证企业博客</span> </span> </div> <div class="profile-intro-name-boxFooter"> <span class="personal-home-page personal-home-years" title="已加入 CSDN 10年">码龄10年</span> <span class="personal-home-page"> <a class="personal-home-certification" href="https://i.csdn.net/#/uc/profile?utm_source=14998968" target="_blank" title="暂无认证"> <img src="https://csdnimg.cn/identity/nocErtification.png" alt=""> 暂无认证 </a> </span> </div> </div> </div> <div class="data-info d-flex item-tiling"> <dl class="text-center" title="12"> <a href="https://blog.csdn.net/qq_18307045" data-report-click='{"mod":"1598321000_001","spm":"1001.2101.3001.4310"}' data-report-query="t=1"> <dt><span class="count">12</span></dt> <dd class="font">原创</dd> </a> </dl> <dl class="text-center" data-report-click='{"mod":"1598321000_002","spm":"1001.2101.3001.4311"}' title="618783"> <a href="https://blog.csdn.net/rank/list/weekly" target="_blank"> <dt><span class="count">61万+</span></dt> <dd class="font">周排名</dd> </a> </dl> <dl class="text-center" title="960274"> <a href="https://blog.csdn.net/rank/list/total" data-report-click='{"mod":"1598321000_003","spm":"1001.2101.3001.4312"}' target="_blank"> <dt><span class="count">96万+</span></dt> <dd class="font">总排名</dd> </a> </dl> <dl class="text-center" style="min-width:58px" title="16014"> <dt><span class="count">1万+</span></dt> <dd>访问</dd> </dl> <dl class="text-center" title="2级,点击查看等级说明"> <dt><a href="https://blog.csdn.net/blogdevteam/article/details/103478461" target="_blank"> <img class="level" src="https://csdnimg.cn/identity/blog2.png"> </a> </dt> <dd>等级</dd> </dl> </div> <div class="item-rank"></div> <div class="data-info d-flex item-tiling"> <dl class="text-center" title="131"> <dt><span class="count">131</span></dt> <dd>积分</dd> </dl> <dl class="text-center" id="fanBox" title="2"> <dt><span class="count" id="fan">2</span></dt> <dd>粉丝</dd> </dl> <dl class="text-center" title="10"> <dt><span class="count">10</span></dt> <dd>获赞</dd> </dl> <dl class="text-center" title="0"> <dt><span class="count">0</span></dt> <dd>评论</dd> </dl> <dl class="text-center" title="35"> <dt><span class="count">35</span></dt> <dd>收藏</dd> </dl> </div> <div class="aside-box-footer" data-report-view='{"spm":"3001.4296"}'> <div class="badge-box d-flex"> <div class="badge d-flex"> <div class="icon-badge" title="新秀勋章"> <div class="mouse-box"> <img class="medal-img" data-report-click='{"spm":"3001.4296"}' src="https://csdnimg.cn/medal/xinxiu@240.png" alt="新秀勋章"> </div> </div> <div class="icon-badge" title="五一创作勋章"> <div class="mouse-box"> <img class="medal-img" data-report-click='{"spm":"3001.4296"}' src="https://csdnimg.cn/medal/51_create.png" alt="五一创作勋章"> </div> </div> <div class="icon-badge" title="持续创作"> <div class="mouse-box"> <img class="medal-img" data-report-click='{"spm":"3001.4296"}' src="https://csdnimg.cn/medal/chizhiyiheng@240.png" alt="持续创作"> </div> </div> <div class="icon-badge" title="创作能手"> <div class="mouse-box"> <img class="medal-img" data-report-click='{"spm":"3001.4296"}' src="https://csdnimg.cn/medal/qixiebiaobing4@240.png" alt="创作能手"> </div> </div> <div class="icon-badge" title="阅读者勋章"> <div class="mouse-box"> <img class="medal-img" data-report-click='{"spm":"3001.4296"}' src="https://csdnimg.cn/medal/yuedu7@240.png" alt="阅读者勋章"> </div> </div> </div> </div> </div> <div class="profile-intro-name-boxOpration"> <div class="opt-letter-watch-box"> <a rel="nofollow" class="bt-button personal-letter" href="https://im.csdn.net/chat/qq_18307045" target="_blank" rel="noopener">私信</a> </div> <div class="opt-letter-watch-box"> <a class="personal-watch bt-button" id="btnAttent" >关注</a> </div> </div> </div> <a id="remuneration" data-report-click='{"spm":"1001.2101.3001.9809"}' rel="nofollow" href="" class="remuneration-box"> <img src="" alt=""> </a> <div id="asideWriteGuide" class="aside-box side-write-guide-box type-2" data-report-view='{"spm":"3001.9728"}'> <div class="content-box"> <a rel="nofollow" href="https://mp.csdn.net" target="_blank" class="btn-go-write" data-report-query="spm=3001.9728" data-report-click='{"spm":"3001.9728"}'> <img src="https://img-home.csdnimg.cn/images/20240218021830.png" alt="写文章"> </a> </div> </div> <div id="asideSearchArticle" class="aside-box"> <div class="aside-content search-comter"> <div class="aside-search aside-search-blog"> <input type="text" class="input-serch-blog" name="" autocomplete="off" value="" id="search-blog-words" placeholder="搜博主文章"> <a class="btn-search-blog" data-report-click='{"spm":"1001.2101.3001.9182"}'> <img src="//csdnimg.cn/cdn/content-toolbar/csdn-sou.png?v=1587021042"> </a> </div> </div> </div> <div id="asideHotArticle" class="aside-box"> <h3 class="aside-title">热门文章</h3> <div class="aside-content"> <ul class="hotArticle-list"> <li> <a href="https://blog.csdn.net/qq_18307045/article/details/124356645" target="_blank" data-report-click='{"mod":"popu_541","spm":"1001.2101.3001.4139","dest":"https://blog.csdn.net/qq_18307045/article/details/124356645","ab":"new"}'> 【MD5加密加盐】 <img src="https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png" alt=""> <span class="read">12220</span> </a> </li> <li> <a href="https://blog.csdn.net/qq_18307045/article/details/124542669" target="_blank" data-report-click='{"mod":"popu_541","spm":"1001.2101.3001.4139","dest":"https://blog.csdn.net/qq_18307045/article/details/124542669","ab":"new"}'> 【session的简单介绍】 <img src="https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png" alt=""> <span class="read">1426</span> </a> </li> <li> <a href="https://blog.csdn.net/qq_18307045/article/details/124886013" target="_blank" data-report-click='{"mod":"popu_541","spm":"1001.2101.3001.4139","dest":"https://blog.csdn.net/qq_18307045/article/details/124886013","ab":"new"}'> 【Element Plus辅助前端开发】 <img src="https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png" alt=""> <span class="read">471</span> </a> </li> <li> <a href="https://blog.csdn.net/qq_18307045/article/details/124531006" target="_blank" data-report-click='{"mod":"popu_541","spm":"1001.2101.3001.4139","dest":"https://blog.csdn.net/qq_18307045/article/details/124531006","ab":"new"}'> 【cookie的简单介绍】 <img src="https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png" alt=""> <span class="read">442</span> </a> </li> <li> <a href="https://blog.csdn.net/qq_18307045/article/details/124324652" target="_blank" data-report-click='{"mod":"popu_541","spm":"1001.2101.3001.4139","dest":"https://blog.csdn.net/qq_18307045/article/details/124324652","ab":"new"}'> 【Servlet-----转发与重定向的区别】 <img src="https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png" alt=""> <span class="read">440</span> </a> </li> </ul> </div> </div> <div id="asideCategory" class="aside-box "> <h3 class="aside-title">分类专栏</h3> <div class="aside-content"> <ul> <li> <a class="clearfix special-column-name" href="https://blog.csdn.net/qq_18307045/category_11760244.html" data-report-click='{"mod":"popu_537","spm":"1001.2101.3001.4137","strategy":"pc付费专栏左侧入口","dest":"https://blog.csdn.net/qq_18307045/category_11760244.html","ab":"new"}'> <div class="special-column-bar "></div> <img src="https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64" alt="" onerror="this.src='https://img-blog.csdnimg.cn/20201014180756922.png?x-oss-process=image/resize,m_fixed,h_64,w_64'"> <span class="title oneline"> 学习笔记 </span> </a> <span class="special-column-num">11篇</span> </li> <li> <a class="clearfix special-column-name" href="https://blog.csdn.net/qq_18307045/category_11760236.html" data-report-click='{"mod":"popu_537","spm":"1001.2101.3001.4137","strategy":"pc付费专栏左侧入口","dest":"https://blog.csdn.net/qq_18307045/category_11760236.html","ab":"new"}'> <div class="special-column-bar "></div> <img src="https://img-blog.csdnimg.cn/20201014180756757.png?x-oss-process=image/resize,m_fixed,h_64,w_64" alt="" onerror="this.src='https://img-blog.csdnimg.cn/20201014180756922.png?x-oss-process=image/resize,m_fixed,h_64,w_64'"> <span class="title oneline"> HTML </span> </a> <span class="special-column-num">4篇</span> </li> </ul> </div> </div> <div id="asideArchive" class="aside-box" style="display:block!important; width:300px;"> <h3 class="aside-title">最新文章</h3> <div class="aside-content"> <ul class="inf_list clearfix"> <li class="clearfix"> <a href="https://blog.csdn.net/qq_18307045/article/details/124886013" target="_blank" data-report-click='{"mod":"popu_382","spm":"1001.2101.3001.4136","dest":"https://blog.csdn.net/qq_18307045/article/details/124886013","ab":"new"}' data-report-view='{"mod":"popu_382","dest":"https://blog.csdn.net/qq_18307045/article/details/124886013","ab":"new"}'>【Element Plus辅助前端开发】</a> </li> <li class="clearfix"> <a href="https://blog.csdn.net/qq_18307045/article/details/124611458" target="_blank" data-report-click='{"mod":"popu_382","spm":"1001.2101.3001.4136","dest":"https://blog.csdn.net/qq_18307045/article/details/124611458","ab":"new"}' data-report-view='{"mod":"popu_382","dest":"https://blog.csdn.net/qq_18307045/article/details/124611458","ab":"new"}'>【HTML入门学习笔记（五）】</a> </li> <li class="clearfix"> <a href="https://blog.csdn.net/qq_18307045/article/details/124542669" target="_blank" data-report-click='{"mod":"popu_382","spm":"1001.2101.3001.4136","dest":"https://blog.csdn.net/qq_18307045/article/details/124542669","ab":"new"}' data-report-view='{"mod":"popu_382","dest":"https://blog.csdn.net/qq_18307045/article/details/124542669","ab":"new"}'>【session的简单介绍】</a> </li> </ul> <div class="archive-bar"></div> <div class="archive-box"> <div class="archive-list-item"><a href="https://blog.csdn.net/qq_18307045?type=blog&year=2022&month=05" target="_blank" data-report-click='{"mod":"popu_538","spm":"1001.2101.3001.4138","ab":"new","dest":"https://blog.csdn.net/qq_18307045?type=blog&year=2022&month=05"}'><span class="year">2022年</span><span class="num">12篇</span></a></div> </div> </div> </div>   <div id="asidedirectory" class="aside-box"> <div class='groupfile' id="directory"> <h3 class="aside-title">目录</h3> <div class="align-items-stretch group_item"> <div class="pos-box"> <div class="scroll-box"> <div class="toc-box"></div> </div> </div> </div> </div> </div> </aside> <script> $("a.flexible-btn").click(function(){ $(this).parents('div.aside-box').removeClass('flexible-box'); $(this).parents("p.text-center").remove(); }) </script> <script type="text/javascript" src="https://g.csdnimg.cn/user-tooltip/2.7/user-tooltip.js"></script> <script type="text/javascript" src="https://g.csdnimg.cn/user-medal/2.0.0/user-medal.js"></script> </div> <div class="recommend-right align-items-stretch clearfix" id="rightAside" data-type="recommend"> <aside class="recommend-right_aside"> <div id="recommend-right" > <div class='flex-column aside-box groupfile' id="groupfile"> <div class="groupfile-div"> <h3 class="aside-title">目录</h3> <div class="align-items-stretch group_item"> <div class="pos-box"> <div class="scroll-box"> <div class="toc-box"></div> </div> </div> </div> </div> </div> <div class='aside-box kind_person d-flex flex-column'> <h3 class="aside-title">分类专栏</h3> <div class="align-items-stretch kindof_item" id="kind_person_column"> <div class="aside-content"> <ul> <li> <a class="clearfix special-column-name" href="https://blog.csdn.net/qq_18307045/category_11760244.html" data-report-click='{"mod":"popu_537","spm":"1001.2101.3001.4137","strategy":"pc付费专栏左侧入口","dest":"https://blog.csdn.net/qq_18307045/category_11760244.html","ab":"new"}'> <div class="special-column-bar "></div> <img src="https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64" alt="" onerror="this.src='https://img-blog.csdnimg.cn/20201014180756922.png?x-oss-process=image/resize,m_fixed,h_64,w_64'"> <span class=""> 学习笔记 </span> </a> <span class="special-column-num">11篇</span> </li> <li> <a class="clearfix special-column-name" href="https://blog.csdn.net/qq_18307045/category_11760236.html" data-report-click='{"mod":"popu_537","spm":"1001.2101.3001.4137","strategy":"pc付费专栏左侧入口","dest":"https://blog.csdn.net/qq_18307045/category_11760236.html","ab":"new"}'> <div class="special-column-bar "></div> <img src="https://img-blog.csdnimg.cn/20201014180756757.png?x-oss-process=image/resize,m_fixed,h_64,w_64" alt="" onerror="this.src='https://img-blog.csdnimg.cn/20201014180756922.png?x-oss-process=image/resize,m_fixed,h_64,w_64'"> <span class=""> HTML </span> </a> <span class="special-column-num">4篇</span> </li> </ul> </div> </div> </div> </div> </aside> </div> <div class="recommend-right1 align-items-stretch clearfix" id="rightAsideConcision" data-type="recommend"> <aside class="recommend-right_aside"> <div id="recommend-right-concision" > <div class='flex-column aside-box groupfile' id="groupfileConcision"> <div class="groupfile-div1"> <h3 class="aside-title">目录</h3> <div class="align-items-stretch group_item"> <div class="pos-box"> <div class="scroll-box"> <div class="toc-box"></div> </div> </div> </div> </div> </div> </div> </aside> </div> </div> <div class="mask-dark"></div> <script type="text/javascript"> var timert = setInterval(function() { sideToolbar = $(".csdn-side-toolbar"); if (sideToolbar.length > 0) { sideToolbar.css('cssText', 'bottom:64px !important;') clearInterval(timert); } }, 200); </script> <div class="skin-boxshadow"></div> <div class="directory-boxshadow"></div> <div class="comment-side-box-shadow comment-side-tit-close" id="commentSideBoxshadow"> <div class="comment-side-content"> <div class="comment-side-tit"> <span class="comment-side-tit-count">评论</span> <img class="comment-side-tit-close" src="https://csdnimg.cn/release/blogv2/dist/pc/img/closeBt.png"></div> <div id="pcCommentSideBox" class="comment-box comment-box-new2 unlogin-comment-box-new" style="display:none"> </div> <div id="pcFlodCommentSideBox" class="pc-flodcomment-sidebox"> <div class="comment-fold-tit"><span id="lookUnFlodComment" class="back"><img src="https://csdnimg.cn/release/blogv2/dist/pc/img/commentArrowLeftWhite.png" alt=""></span>被折叠的 <span class="count"></span> 条评论 <a href="https://blogdev.blog.csdn.net/article/details/122245662" class="tip" target="_blank">为什么被折叠?</a> <a href="https://bbs.csdn.net/forums/FreeZone" class="park" target="_blank"> <img src="https://csdnimg.cn/release/blogv2/dist/pc/img/iconPark.png">到【灌水乐园】发言</a> </div> <div class="comment-fold-content"></div> <div id="lookBadComment" class="look-bad-comment side-look-comment"> <a class="look-more-comment">查看更多评论<img src="https://csdnimg.cn/release/blogv2/dist/pc/img/commentArrowDownWhite.png" alt=""></a> </div> </div> </div> <div class="comment-rewarddialog-box"> <div class="form-box"> <div class="title-box"> 添加红包 <a class="btn-form-close"></a> </div> <form id="commentRewardForm"> <div class="ipt-box"> <label for="txtName">祝福语</label> <div class="ipt-btn-box"> <input type="text" name="name" id="txtName" autocomplete="off" maxlength="50"> <a class="btn-ipt btn-random"></a> </div> <p class="notice">请填写红包祝福语或标题</p> </div> <div class="ipt-box"> <label for="txtSendAmount">红包数量</label> <div class="ipt-txt-box"> <input type="text" name="sendAmount" maxlength="4" id="txtSendAmount" placeholder="请填写红包数量(最小10个)" autocomplete="off"> <span class="after-txt">个</span> </div> <p class="notice">红包个数最小为10个</p> </div> <div class="ipt-box"> <label for="txtMoney">红包总金额</label> <div class="ipt-txt-box error"> <input type="text" name="money" maxlength="5" id="txtMoney" placeholder="请填写总金额(最低5元)" autocomplete="off"> <span class="after-txt">元</span> </div> <p class="notice">红包金额最低5元</p> </div> <div class="balance-info-box"> <label>余额支付</label> <div class="balance-info"> 当前余额<span class="balance">3.43</span>元 <a href="https://i.csdn.net/#/wallet/balance/recharge" class="link-charge" target="_blank">前往充值 ></a> </div> </div> <div class="opt-box"> <div class="pay-info"> 需支付：<span class="price">10.00</span>元 </div> <button type="button" class="ml-auto btn-cancel">取消</button> <button type="button" class="ml8 btn-submit" disabled="true">确定</button> </div> </form> </div> </div> <div class="rr-guide-box"> <div class="rr-first-box"> <img src="https://csdnimg.cn/release/blogv2/dist/pc/img/guideRedReward02.png" alt=""> <button class="btn-guide-known next">下一步</button> </div> <div class="rr-second-box"> <img src="https://csdnimg.cn/release/blogv2/dist/pc/img/guideRedReward03.png" alt=""> <button class="btn-guide-known known">知道了</button> </div> </div> </div> <div class="redEnvolope" id="redEnvolope"> <div class="env-box"> <div class="env-container"> <div class="pre-open" id="preOpen"> <div class="top"> <header> <img class="clearTpaErr" :src="redpacketAuthor.avatar" alt="" /> <div class="author">成就一亿技术人!</div> </header> <div class="bot-icon"></div> </div> <footer> <div class="red-openbtn open-start"></div> <div class="tip"> 领取后你会自动成为博主和红包主的粉丝 <a class="rule" target="_blank">规则</a> </div> </footer> </div> <div class="opened" id="opened"> <div class="bot-icon"> <header> <a class="creatorUrl" href="" target="_blank"> <img class="clearTpaErr" src="https://profile-avatar.csdnimg.cn/default.jpg!2" alt="" /> </a> <div class="author"> <div class="tt">hope_wisdom</div> 发出的红包 </div> </header> </div> <div class="receive-box"> <header></header> <div class="receive-list"> </div> </div> </div> </div> <div class="close-btn"></div> </div> </div> <div class="pay-code"> <div class="pay-money">实付<span class="pay-money-span" data-nowprice='' data-oldprice=''>元</span></div> <div class="content-blance"><a class="blance-bt" href="javascript:;">使用余额支付</a></div> <div class="content-code"> <div id="payCode" data-id=""> <div class="renovate"> <img src="https://csdnimg.cn/release/blogv2/dist/pc/img/pay-time-out.png"> <span>点击重新获取</span> </div> </div> <div class="pay-style"><span><img src="https://csdnimg.cn/release/blogv2/dist/pc/img/weixin.png"></span><span><img src="https://csdnimg.cn/release/blogv2/dist/pc/img/zhifubao.png"></span><span><img src="https://csdnimg.cn/release/blogv2/dist/pc/img/jingdong.png"></span><span class="text">扫码支付</span></div> </div> <div class="bt-close"> <svg t="1567152543821" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10924" xmlns:xlink="http://www.w3.org/1999/xlink" width="12" height="12"> <defs> <style type="text/css"></style> </defs> <path d="M512 438.378667L806.506667 143.893333a52.032 52.032 0 1 1 73.6 73.621334L585.621333 512l294.485334 294.485333a52.074667 52.074667 0 0 1-73.6 73.642667L512 585.621333 217.514667 880.128a52.053333 52.053333 0 1 1-73.621334-73.642667L438.378667 512 143.893333 217.514667a52.053333 52.053333 0 1 1 73.621334-73.621334L512 438.378667z" fill="" p-id="10925"></path> </svg> </div> <div class="pay-balance"> <input type="radio" class="pay-code-radio" data-type="details"> <span class="span">钱包余额</span> <span class="balance" style="color:#FC5531;font-size:14px;">0</span> <div class="pay-code-tile"> <img src="https://csdnimg.cn/release/blogv2/dist/pc/img/pay-help.png" alt=""> <div class="pay-code-content"> <div class="span"> <p class="title">抵扣说明：</p> <p> 1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。<br> 2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。</p> </div> </div> </div> </div> <a class="pay-balance-con" href="https://i.csdn.net/#/wallet/balance/recharge" target="_blank"><img src="https://csdnimg.cn/release/blogv2/dist/pc/img/recharge.png" alt=""><span>余额充值</span></a> </div> <div style="display:none;"> <img src="" onerror='setTimeout(function(){if(!/(csdn.net|iteye.com|baiducontent.com|googleusercontent.com|360webcache.com|sogoucdn.com|bingj.com|baidu.com)$/.test(window.location.hostname)){window.location.href="\x68\x74\x74\x70\x73\x3a\x2f\x2f\x77\x77\x77\x2e\x63\x73\x64\x6e\x2e\x6e\x65\x74"}},3000);'> </div> <div class="keyword-dec-box" id="keywordDecBox"></div> </body> <script src="https://csdnimg.cn/release/blogv2/dist/components/js/axios-83fa28cedf.min.js" type="text/javascript"></script> <script src="https://csdnimg.cn/release/blogv2/dist/components/js/pc_wap_highlight-8defd55d6e.min.js" type="text/javascript"></script> <script src="https://csdnimg.cn/release/blogv2/dist/components/js/pc_wap_common-be82269d23.min.js" type="text/javascript"></script> <script src="https://csdnimg.cn/release/blogv2/dist/components/js/edit_copy_code-354ae1b335.min.js" type="text/javascript"></script> <script src="https://g.csdnimg.cn/lib/cboxEditor/1.1.6/embed-editor.min.js" type="text/javascript"></script> <link rel="stylesheet" href="https://g.csdnimg.cn/lib/cboxEditor/1.1.6/embed-editor.min.css"> <link rel="stylesheet" href="https://csdnimg.cn/release/blog_editor_html/release1.6.12/ckeditor/plugins/codesnippet/lib/highlight/styles/atom-one-light.css"> <script src="https://g.csdnimg.cn/user-accusation/1.0.6/user-accusation.js" type="text/javascript"></script> <script> // 全局声明 if (window.csdn === undefined) { window.csdn = {}; } window.csdn.sideToolbar = { options: { report: { isShow: true, }, qr: { isShow: false, }, guide: { isShow: true } } } $(function() { $(document).on('click', "a.option-box[data-type='report']", function() { window.csdn.loginBox.key({ biz: 'blog', subBiz: 'other_service', cb: function() { window.csdn.feedback({ "type": 'blog', "rtype": 'article', "rid": articleId, "reportedName": username, "submitOptions": { "title": articleTitle, "contentUrl": articleDetailUrl }, "callback": function() { showToast({ text: "感谢您的举报，我们会尽快审核！", bottom: '10%', zindex: 9000, speed: 500, time: 1500 }) } }) } }) }); }) </script> <script src="https://g.csdnimg.cn/baidu-search/1.0.12/baidu-search.js" type="text/javascript"></script> <script src="https://csdnimg.cn/release/download/old_static/js/qrcode.js"></script> <script src="https://g.csdnimg.cn/lib/qrcode/1.0.0/qrcode.min.js"></script> <script src="https://g.csdnimg.cn/user-ordercart/3.0.1/user-ordercart.js" type="text/javascript"></script> <script src="https://g.csdnimg.cn/user-ordertip/5.0.3/user-ordertip.js" type="text/javascript"></script> <script src="https://g.csdnimg.cn/order-payment/4.0.5/order-payment.js" type="text/javascript"></script> <script src="https://csdnimg.cn/release/blogv2/dist/pc/js/common-a425354f6a.min.js" type="text/javascript"></script> <script src="https://csdnimg.cn/release/blogv2/dist/pc/js/detail-336f6971b5.min.js" type="text/javascript"></script> <script src="https://csdnimg.cn/release/blogv2/dist/pc/js/column-f814d377e0.min.js" type="text/javascript"></script> <script src="https://g.csdnimg.cn/side-toolbar/3.4/side-toolbar.js" type="text/javascript"></script> <script src="https://g.csdnimg.cn/copyright/1.0.4/copyright.js" type="text/javascript"></script> <script> $(".MathJax").remove(); if ($('div.markdown_views pre.prettyprint code.hljs').length > 0) { $('div.markdown_views')[0].className = 'markdown_views'; } </script> <script type="text/javascript" src="https://csdnimg.cn/release/blog_mathjax/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script> <script type="text/x-mathjax-config"> MathJax.Hub.Config({ "HTML-CSS": { linebreaks: { automatic: true, width: "94%container" }, imageFont: null }, tex2jax: { preview: "none", ignoreClass:"title-article" }, mml2jax: { preview: 'none' } }); </script> <script type="text/javascript" crossorigin src="https://g.csdnimg.cn/common/csdn-login-box/csdn-login-box.js"></script></html>