本文最后更新于 67 天前，其中的信息可能已经过时，如有错误请发送邮件到wuxianglongblog@163.com
前端_HTML 基础
一、什么是HTML？
HTML是超文本标记语言，超文本标记语言包括文字、图片、音频、视频、动画等。
二、HTML的发展史
三、HTML5的优势
世界知名浏览器厂商对HTML5的支持、微软、Google、苹果、市场的需求等
四、HTML基本结构
<html>
<!--网页头部-->
<head>
<title>我的第一个网页</title>
</head>
<!--主体部分-->
<body>
我的第一个网页
</body>
</html>
五、DOCTYPE声明
<!DOCTYPE html>
<!--html告诉浏览器使用什么规范-->
<html>
<head lang="en">
<meta charset="utf-8"/>
<title>新建标签页</title>
</head>
<body>
</body>
</html>
六、标签</h2>
<p><div class='fancybox-wrapper lazyload-container-unload' data-fancybox='post-images' href='https://tc.wuxianglong.cn/blog/2024/03/07/1677158360221-0c729491-f226-4b40-9d7a-2b586cf90352-2024-03-07-1709742018.png'><img class="lazyload lazyload-style-3" src="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPgo8c3ZnIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgc3Ryb2tlPSIjZmZmZmZmMDAiPjxnPjwvZz4KPC9zdmc+" decoding="async" data-original="https://tc.wuxianglong.cn/blog/2024/03/07/1677158360221-0c729491-f226-4b40-9d7a-2b586cf90352-2024-03-07-1709742018.png" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" alt="image.png" /></div></p>
<h2>七、<meta>标签</h2>
<blockquote>
<p>utf-8 则包含全世界所有国家需要用到的字符，页面编码应与页面文件保存时的编码一致</p>
</blockquote>
<p><div class='fancybox-wrapper lazyload-container-unload' data-fancybox='post-images' href='https://tc.wuxianglong.cn/blog/2024/03/07/1677158402862-8f10a71f-5836-4fa4-83ed-ac4582187983-2024-03-07-1709742021.png'><img class="lazyload lazyload-style-3" src="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPgo8c3ZnIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgc3Ryb2tlPSIjZmZmZmZmMDAiPjxnPjwvZz4KPC9zdmc+" decoding="async" data-original="https://tc.wuxianglong.cn/blog/2024/03/07/1677158402862-8f10a71f-5836-4fa4-83ed-ac4582187983-2024-03-07-1709742021.png" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" alt="image.png" /></div></p>
<h2>八、标题标签</h2>
<pre><code class="language-html"><h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6></code></pre>
<p><div class='fancybox-wrapper lazyload-container-unload' data-fancybox='post-images' href='https://tc.wuxianglong.cn/blog/2024/03/07/1677158430182-a63e4427-057f-491d-a07a-16ab6dce153b-2024-03-07-1709742025.png'><img class="lazyload lazyload-style-3" src="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPgo8c3ZnIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgc3Ryb2tlPSIjZmZmZmZmMDAiPjxnPjwvZz4KPC9zdmc+" decoding="async" data-original="https://tc.wuxianglong.cn/blog/2024/03/07/1677158430182-a63e4427-057f-491d-a07a-16ab6dce153b-2024-03-07-1709742025.png" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" alt="image.png" /></div></p>
<h2>九、段落标签</h2>
<p><code><p>有勇气就会有奇迹</p></code><br />
<div class='fancybox-wrapper lazyload-container-unload' data-fancybox='post-images' href='https://tc.wuxianglong.cn/blog/2024/03/07/1677158445469-0a2b7b10-24c9-49ba-86ce-8630ae397991-2024-03-07-1709742029.png'><img class="lazyload lazyload-style-3" src="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPgo8c3ZnIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgc3Ryb2tlPSIjZmZmZmZmMDAiPjxnPjwvZz4KPC9zdmc+" decoding="async" data-original="https://tc.wuxianglong.cn/blog/2024/03/07/1677158445469-0a2b7b10-24c9-49ba-86ce-8630ae397991-2024-03-07-1709742029.png" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" alt="image.png" /></div></p>
<h2>十、换行标签</h2>
<pre><code class="language-html"><p>
有勇气!<br/>有奇迹!<br/>....
</p></code></pre>
<p><div class='fancybox-wrapper lazyload-container-unload' data-fancybox='post-images' href='https://tc.wuxianglong.cn/blog/2024/03/07/1677158511058-9173b1b2-cd58-4210-96fe-96a1cda77215-2024-03-07-1709742033.png'><img class="lazyload lazyload-style-3" src="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPgo8c3ZnIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgc3Ryb2tlPSIjZmZmZmZmMDAiPjxnPjwvZz4KPC9zdmc+" decoding="async" data-original="https://tc.wuxianglong.cn/blog/2024/03/07/1677158511058-9173b1b2-cd58-4210-96fe-96a1cda77215-2024-03-07-1709742033.png" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" alt="image.png" /></div></p>
<h2>十一、水平线标签</h2>
<pre><code class="language-html"><p>
有勇气!<br/><hr/>有奇迹!<br/><hr/>....
</p></code></pre>
<p><div class='fancybox-wrapper lazyload-container-unload' data-fancybox='post-images' href='https://tc.wuxianglong.cn/blog/2024/03/07/1677158537171-44a852b0-3f2b-49ee-8ad5-ff90af44fe89-2024-03-07-1709742036.png'><img class="lazyload lazyload-style-3" src="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPgo8c3ZnIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgc3Ryb2tlPSIjZmZmZmZmMDAiPjxnPjwvZz4KPC9zdmc+" decoding="async" data-original="https://tc.wuxianglong.cn/blog/2024/03/07/1677158537171-44a852b0-3f2b-49ee-8ad5-ff90af44fe89-2024-03-07-1709742036.png" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" alt="image.png" /></div></p>
<h2>十二、字体样式标签</h2>
<p>加粗：<code><strong>…</strong></code><br />
斜体：<code><em>…</em></code></p>
<pre><code class="language-html"><p>
<strong><em>有勇气,有奇迹!</em></strong>
</p></code></pre>
<p><div class='fancybox-wrapper lazyload-container-unload' data-fancybox='post-images' href='https://tc.wuxianglong.cn/blog/2024/03/07/1677158578710-fd530e18-1cf9-414e-9488-4bfc497bdc58-2024-03-07-1709742040.png'><img class="lazyload lazyload-style-3" src="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPgo8c3ZnIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgc3Ryb2tlPSIjZmZmZmZmMDAiPjxnPjwvZz4KPC9zdmc+" decoding="async" data-original="https://tc.wuxianglong.cn/blog/2024/03/07/1677158578710-fd530e18-1cf9-414e-9488-4bfc497bdc58-2024-03-07-1709742040.png" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" alt="image.png" /></div></p>
<h2>十三、特殊符号</h2>
<table>
<thead>
<tr>
<th>特殊符号</th>
<th>字符实体</th>
<th>示例</th>
</tr>
</thead>
<tbody>
<tr>
<td>空格</td>
<td></td>
<td></td>
</tr>
<tr>
<td>百度 新浪</td>
<td></td>
<td></td>
</tr>
<tr>
<td>大于号(>)</td>
<td>></td>
<td>如果时间>晚上6点，就坐车回家</td>
</tr>
<tr>
<td>小于号(<)</td>
<td><</td>
<td>如果时间<早上7点，就走路去上学</td>
</tr>
<tr>
<td>引号(")</td>
<td>"</td>
<td>HTML的属性值必须用成对的"引起来</td>
</tr>
<tr>
<td>版权符号@</td>
<td>©</td>
<td>© 百度</td>
</tr>
</tbody>
</table>
<h2>十四、图像标签</h2>
<blockquote>
<p>常见的图像格式：JPG、GIF、PNG、BMP</p>
</blockquote>
<pre><code class="language-html"><img src="path" alt="text" title="text" width="x" height="y" /></code></pre>
<p><div class='fancybox-wrapper lazyload-container-unload' data-fancybox='post-images' href='https://tc.wuxianglong.cn/blog/2024/03/07/1677158640246-34e16c1a-666e-4866-bdc9-5cb6319c8baa-2024-03-07-1709742045.png'><img class="lazyload lazyload-style-3" src="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPgo8c3ZnIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgc3Ryb2tlPSIjZmZmZmZmMDAiPjxnPjwvZz4KPC9zdmc+" decoding="async" data-original="https://tc.wuxianglong.cn/blog/2024/03/07/1677158640246-34e16c1a-666e-4866-bdc9-5cb6319c8baa-2024-03-07-1709742045.png" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" alt="image.png" /></div></p>
<h2>十五、链接标签</h2>
<pre><code class="language-html"><a href="path" target="目标窗口位置">链接文本或图像</a></code></pre>
<p><div class='fancybox-wrapper lazyload-container-unload' data-fancybox='post-images' href='https://tc.wuxianglong.cn/blog/2024/03/07/1677158676725-76f2f5dc-1a00-439a-9101-f0ccadd4db6f-2024-03-07-1709742048.png'><img class="lazyload lazyload-style-3" src="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPgo8c3ZnIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgc3Ryb2tlPSIjZmZmZmZmMDAiPjxnPjwvZz4KPC9zdmc+" decoding="async" data-original="https://tc.wuxianglong.cn/blog/2024/03/07/1677158676725-76f2f5dc-1a00-439a-9101-f0ccadd4db6f-2024-03-07-1709742048.png" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" alt="image.png" /></div></p>
<h2>十六、锚链接</h2>
<blockquote>
<p>从A页面的甲位置跳转到本页中的乙位置<br />
从A页面的甲位置跳转到B页面中的乙位置</p>
</blockquote>
<h3>1、创建跳转标记</h3>
<pre><code class="language-html"><a name="marker">乙位置</a></code></pre>
<h3>2、创建跳转链接</h3>
<pre><code class="language-html"><a href="#marker">甲位置</a></code></pre>
<h2>十七、邮件链接</h2>
<pre><code class="language-html"><a href="mailto:.....@gmail.com">联系我们</a></code></pre>
<h2>十八、行内元素和块元素</h2>
<h3>块元素</h3>
<blockquote>
<p>无论内容多少，该元素独占一行（p、h1-h6…）</p>
</blockquote>
<h3>行内元素</h3>
<blockquote>
<p>内容撑开宽度，左右都是行内元素的可以排在一行(a、strong、em…)</p>
</blockquote>
</div>
<div class='additional-content-after-post'>谨此笔记，记录过往。凭君阅览，如能收益，莫大奢望。</div>
<div class="post-tags">
<i class="fa fa-tags" aria-hidden="true"></i>
<a href='https://wuxianglong.cn/tag/java/' target='_blank' class='tag badge badge-secondary post-meta-detail-tag'>Java</a><a href='https://wuxianglong.cn/tag/qianduan/' target='_blank' class='tag badge badge-secondary post-meta-detail-tag'>前端</a> </div>
</article>
<div id="share_container">
<div id="share" data-initialized="true">
<a class="no-pjax icon-wechat" tooltip="分享到微信">
<button class="btn btn-icon btn-success">
<span class="btn-inner--icon"><i class="fa fa-weixin"></i></span>
</button>
</a>
<a target="_blank" class="no-pjax icon-douban" tooltip="分享到豆瓣">
<button class="btn btn-icon btn-primary" style="background: #209261;border: none;">
<span aria-hidden="true">豆</span>
</button>
</a>
<a target="_blank" class="no-pjax icon-qq" tooltip="分享到 QQ">
<button class="btn btn-icon btn-primary" style="background: #2196f3;border: none;">
<span class="btn-inner--icon"><i class="fa fa-qq"></i></span>
</button>
</a>
<a target="_blank" class="no-pjax icon-qzone" tooltip="分享到 QQ 空间">
<button class="btn btn-icon btn-primary" style="background: #ffc107;border: none;">
<span class="btn-inner--icon"><i class="fa fa-star"></i></span>
</button>
</a>
<a target="_blank" class="no-pjax icon-weibo" tooltip="分享到微博">
<button class="btn btn-icon btn-warning">
<span class="btn-inner--icon"><i class="fa fa-weibo"></i></span>
</button>
</a>
<a target="_blank" class="no-pjax icon-copy-link" id="share_copy_link" tooltip="复制链接">
<button class="btn btn-icon btn-default">
<span class="btn-inner--icon"><i class="fa fa-link"></i></span>
</button>
</a>
</div>
<button id="share_show" class="btn btn-icon btn-primary" tooltip="分享">
<span class="btn-inner--icon"><i class="fa fa-share"></i></span>
</button>
</div>
<script type="text/javascript">
socialShare("#share", {
title : '008、前端_HTML 基础',
description : '前端_HTML 基础 一、什么是HTML？ HTML是超文本标记语言，超文本标记语言包括文字、图片、…',
wechatQrcodeTitle : "分享到微信",
wechatQrcodeHelper : '微信扫描二维码',
source : 'https://wuxianglong.cn/qianduanhtmljichu/'
});
$("#share_show")[0].onclick = function(){
$("#share_container").addClass("opened");
};
$("#share_copy_link")[0].onclick = function(){
let input = document.createElement('input');
document.body.appendChild(input);
input.setAttribute("value", window.location.href);
input.setAttribute("readonly", "readonly");
input.setAttribute("style", "opacity: 0;mouse-events:none;");
input.select();
if (document.execCommand('copy')){
iziToast.show({
title: '链接已复制',
message: "链接已复制到剪贴板",
class: 'shadow',
position: 'topRight',
backgroundColor: '#2dce89',
titleColor: '#ffffff',
messageColor: '#ffffff',
iconColor: '#ffffff',
progressBarColor: '#ffffff',
icon: 'fa fa-check',
timeout: 5000
});
}else{
iziToast.show({
title: '复制失败',
message: "请手动复制链接",
class: 'shadow',
position: 'topRight',
backgroundColor: '#f5365c',
titleColor: '#ffffff',
messageColor: '#ffffff',
iconColor: '#ffffff',
progressBarColor: '#ffffff',
icon: 'fa fa-close',
timeout: 5000
});
}
document.body.removeChild(input);
};
</script>
<div id="comments" class="comments-area card shadow-sm">
<div class="card-body">
<span>暂无评论</span>
</div>
</div>
<div id="post_comment" class="card shadow-sm no-need-captcha enable-qq-avatar">
<div class="card-body">
<h2 class="post-comment-title">
<i class="fa fa-commenting"></i>
<span class="hide-on-comment-editing">发送评论</span>
<span class="hide-on-comment-not-editing">编辑评论</span>
</h2>
<div id="post_comment_reply_info" class="post-comment-reply" style="display: none;">
<span>正在回复 <b><span id="post_comment_reply_name"></span></b> 的评论 :</span>
<div id="post_comment_reply_preview" class="post-comment-reply-preview"></div>
<button id="post_comment_reply_cancel" class="btn btn-outline-primary btn-sm">取消回复</button>
</div>
<form>
<div class="row">
<div class="col-md-12">
<textarea id="post_comment_content" class="form-control form-control-alternative" placeholder="评论内容" name="comment" style="height: 80px;"></textarea>
</div>
<div class="col-md-12" style="height: 0;overflow: hidden;">
<pre id="post_comment_content_hidden" class=""></pre>
</div>
</div>
<div class="row hide-on-comment-editing" style="margin-bottom: -10px;">
<div class="col-md-6">
<div class="form-group">
<div class="input-group input-group-alternative mb-4">
<div class="input-group-prepend">
<span class="input-group-text"><i class="fa fa-user-circle"></i></span>
</div>
<input id="post_comment_name" class="form-control" placeholder="昵称" type="text" name="author" value="">
</div>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<div class="input-group input-group-alternative mb-4">
<div class="input-group-prepend">
<span class="input-group-text"><i class="fa fa-envelope"></i></span>
</div>
<input id="post_comment_email" class="form-control" placeholder="邮箱 / QQ 号" type="email" name="email" value="">
</div>
</div>
</div>
<div class="d-none">
<div class="form-group">
<div class="input-group input-group-alternative mb-4 post-comment-captcha-container" captcha="15 + 2 = ">
<div class="input-group-prepend">
<span class="input-group-text"><i class="fa fa-key"></i></span>
</div>
<input id="post_comment_captcha" class="form-control" placeholder="验证码" type="text" >
<style>
.post-comment-captcha-container:before{
content: attr(captcha);
}
</style>
</div>
</div>
</div>
</div>
<div class="row hide-on-comment-editing" id="post_comment_extra_input" style="display: none";>
<div class="col-md-12" style="margin-bottom: -10px;">
<div class="form-group">
<div class="input-group input-group-alternative mb-4 post-comment-link-container">
<div class="input-group-prepend">
<span class="input-group-text"><i class="fa fa-link"></i></span>
</div>
<input id="post_comment_link" class="form-control" placeholder="网站" type="text" name="url" value="">
</div>
</div>
</div>
</div>
<div class="row hide-on-comment-editing d-none" style="margin-top: 10px; ">
<div class="col-md-12">
<button id="post_comment_toggle_extra_input" type="button" class="btn btn-icon btn-outline-primary btn-sm" tooltip-show-extra-field="展开附加字段" tooltip-hide-extra-field="折叠附加字段">
<span class="btn-inner--icon"><i class="fa fa-angle-down"></i></span>
</button>
</div></div>
<div class="row" style="margin-top: 5px; margin-bottom: 10px;">
<div class="col-md-12">
<div class="custom-control custom-checkbox comment-post-checkbox comment-post-use-markdown">
<input class="custom-control-input" id="comment_post_use_markdown" type="checkbox" checked="true">
<label class="custom-control-label" for="comment_post_use_markdown">Markdown</label>
</div>
<div class="custom-control custom-checkbox comment-post-checkbox comment-post-privatemode" tooltip="评论仅发送者和博主可见">
<input class="custom-control-input" id="comment_post_privatemode" type="checkbox">
<label class="custom-control-label" for="comment_post_privatemode">悄悄话</label>
</div>
<div class="custom-control custom-checkbox comment-post-checkbox comment-post-mailnotice" tooltip="有回复时邮件通知我">
<input class="custom-control-input" id="comment_post_mailnotice" type="checkbox" checked>
<label class="custom-control-label" for="comment_post_mailnotice">邮件提醒</label>
</div>
<button id="post_comment_send" class="btn btn-icon btn-primary comment-btn pull-right mr-0" type="button">
<span class="btn-inner--icon hide-on-comment-editing"><i class="fa fa-send"></i></span>
<span class="btn-inner--icon hide-on-comment-not-editing"><i class="fa fa-pencil"></i></span>
<span class="btn-inner--text hide-on-comment-editing" style="margin-right: 0;">发送</span>
<span class="btn-inner--text hide-on-comment-not-editing" style="margin-right: 0;">编辑</span>
</button>
<button id="post_comment_edit_cancel" class="btn btn-icon btn-danger comment-btn pull-right hide-on-comment-not-editing" type="button" style="margin-right: 8px;">
<span class="btn-inner--icon"><i class="fa fa-close"></i></span>
<span class="btn-inner--text">取消</span>
</button>
<button id="comment_emotion_btn" class="btn btn-icon btn-primary pull-right" type="button" title="表情">
<i class="fa fa-smile-o" aria-hidden="true"></i>
</button>
<div id="emotion_keyboard" class="emotion-keyboard card shadow-sm bg-white">
<div class="emotion-keyboard-content">
<div class='emotion-group' index='0'><div class='emotion-item' text='|´・ω・)ノ' title=''>|´・ω・)ノ</div><div class='emotion-item' text='ヾ(≧∇≦*)ゝ' title=''>ヾ(≧∇≦*)ゝ</div><div class='emotion-item' text='(☆ω☆)' title=''>(☆ω☆)</div><div class='emotion-item' text='（╯‵□′）╯︵┴─┴' title=''>（╯‵□′）╯︵┴─┴</div><div class='emotion-item' text='￣﹃￣' title=''>￣﹃￣</div><div class='emotion-item' text='(/ω＼)' title=''>(/ω＼)</div><div class='emotion-item' text='∠( ᐛ 」∠)＿' title=''>∠( ᐛ 」∠)＿</div><div class='emotion-item' text='(๑•̀ㅁ•́ฅ)' title=''>(๑•̀ㅁ•́ฅ)</div><div class='emotion-item' text='→_→' title=''>→_→</div><div class='emotion-item' text='୧(๑•̀⌄•́๑)૭' title=''>୧(๑•̀⌄•́๑)૭</div><div class='emotion-item' text='٩(ˊᗜˋ*)و' title=''>٩(ˊᗜˋ*)و</div><div class='emotion-item' text='(ノ°ο°)ノ' title=''>(ノ°ο°)ノ</div><div class='emotion-item' text='(´இ皿இ｀)' title=''>(´இ皿இ｀)</div><div class='emotion-item' text='⌇●﹏●⌇' title=''>⌇●﹏●⌇</div><div class='emotion-item' text='(ฅ´ω`ฅ)' title=''>(ฅ´ω`ฅ)</div><div class='emotion-item' text='(╯°A°)╯︵○○○' title=''>(╯°A°)╯︵○○○</div><div class='emotion-item' text='φ(￣∇￣o)' title=''>φ(￣∇￣o)</div><div class='emotion-item' text='ヾ(´･ ･｀｡)ノ"' title=''>ヾ(´･ ･｀｡)ノ"</div><div class='emotion-item' text='( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃' title=''>( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃</div><div class='emotion-item' text='(ó﹏ò｡)' title=''>(ó﹏ò｡)</div><div class='emotion-item' text='Σ(っ °Д °;)っ' title=''>Σ(っ °Д °;)っ</div><div class='emotion-item' text='( ,,´･ω･)ﾉ"(´っω･｀｡)' title=''>( ,,´･ω･)ﾉ"(´っω･｀｡)</div><div class='emotion-item' text='╮(╯▽╰)╭' title=''>╮(╯▽╰)╭</div><div class='emotion-item' text='o(*////▽////*)q' title=''>o(*////▽////*)q</div><div class='emotion-item' text='＞﹏＜' title=''>＞﹏＜</div><div class='emotion-item' text='( ๑´•ω•) "(ㆆᴗㆆ)' title=''>( ๑´•ω•) "(ㆆᴗㆆ)</div></div><div class='emotion-group d-none' index='1'><div class='emotion-item' text='😂' title=''>😂</div><div class='emotion-item' text='😀' title=''>😀</div><div class='emotion-item' text='😅' title=''>😅</div><div class='emotion-item' text='😊' title=''>😊</div><div class='emotion-item' text='🙂' title=''>🙂</div><div class='emotion-item' text='🙃' title=''>🙃</div><div class='emotion-item' text='😌' title=''>😌</div><div class='emotion-item' text='😍' title=''>😍</div><div class='emotion-item' text='😘' title=''>😘</div><div class='emotion-item' text='😜' title=''>😜</div><div class='emotion-item' text='😝' title=''>😝</div><div class='emotion-item' text='😏' title=''>😏</div><div class='emotion-item' text='😒' title=''>😒</div><div class='emotion-item' text='🙄' title=''>🙄</div><div class='emotion-item' text='😳' title=''>😳</div><div class='emotion-item' text='😡' title=''>😡</div><div class='emotion-item' text='😔' title=''>😔</div><div class='emotion-item' text='😫' title=''>😫</div><div class='emotion-item' text='😱' title=''>😱</div><div class='emotion-item' text='😭' title=''>😭</div><div class='emotion-item' text='💩' title=''>💩</div><div class='emotion-item' text='👻' title=''>👻</div><div class='emotion-item' text='🙌' title=''>🙌</div><div class='emotion-item' text='🖕' title=''>🖕</div><div class='emotion-item' text='👍' title=''>👍</div><div class='emotion-item' text='👫' title=''>👫</div><div class='emotion-item' text='👬' title=''>👬</div><div class='emotion-item' text='👭' title=''>👭</div><div class='emotion-item' text='🌚' title=''>🌚</div><div class='emotion-item' text='🌝' title=''>🌝</div><div class='emotion-item' text='🙈' title=''>🙈</div><div class='emotion-item' text='💊' title=''>💊</div><div class='emotion-item' text='😶' title=''>😶</div><div class='emotion-item' text='🙏' title=''>🙏</div><div class='emotion-item' text='🍦' title=''>🍦</div><div class='emotion-item' text='🍉' title=''>🍉</div><div class='emotion-item' text='😣' title=''>😣</div></div><div class='emotion-group d-none' index='2'><div class='emotion-item emotion-item-sticker' code='dinosaur-shy' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/dinosaur/1.jpg'/></div><div class='emotion-item emotion-item-sticker' code='dinosaur-daze' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/dinosaur/2.jpg'/></div><div class='emotion-item emotion-item-sticker' code='dinosaur-sweat' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/dinosaur/3.jpg'/></div><div class='emotion-item emotion-item-sticker' code='dinosaur-proud' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/dinosaur/4.jpg'/></div><div class='emotion-item emotion-item-sticker' code='dinosaur-powerless' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/dinosaur/5.jpg'/></div><div class='emotion-item emotion-item-sticker' code='dinosaur-pouting' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/dinosaur/6.jpg'/></div><div class='emotion-item emotion-item-sticker' code='dinosaur-eating' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/dinosaur/7.jpg'/></div><div class='emotion-item emotion-item-sticker' code='dinosaur-ok' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/dinosaur/8.jpg'/></div><div class='emotion-item emotion-item-sticker' code='dinosaur-doubt' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/dinosaur/9.jpg'/></div><div class='emotion-item emotion-item-sticker' code='dinosaur-depressed' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/dinosaur/10.jpg'/></div><div class='emotion-item emotion-item-sticker' code='dinosaur-close-eyes' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/dinosaur/11.jpg'/></div><div class='emotion-item emotion-item-sticker' code='dinosaur-sleeping' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/dinosaur/12.jpg'/></div><div class='emotion-item emotion-item-sticker' code='dinosaur-puzzled' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/dinosaur/13.jpg'/></div><div class='emotion-item emotion-item-sticker' code='dinosaur-agree' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/dinosaur/14.jpg'/></div><div class='emotion-item emotion-item-sticker' code='dinosaur-crazy' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/dinosaur/15.jpg'/></div><div class='emotion-item emotion-item-sticker' code='dinosaur-angry' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/dinosaur/16.jpg'/></div></div><div class='emotion-group d-none' index='3'><div class='emotion-item emotion-item-sticker' code='flower-flower' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/flower/1.jpg'/></div><div class='emotion-item emotion-item-sticker' code='flower-grass' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/flower/2.jpg'/></div><div class='emotion-item emotion-item-sticker' code='flower-leaf' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/flower/3.jpg'/></div><div class='emotion-item emotion-item-sticker' code='flower-star' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/flower/4.jpg'/></div><div class='emotion-item emotion-item-sticker' code='flower-sun' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/flower/5.jpg'/></div><div class='emotion-item emotion-item-sticker' code='flower-moon' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/flower/6.jpg'/></div><div class='emotion-item emotion-item-sticker' code='flower-water' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/flower/7.jpg'/></div><div class='emotion-item emotion-item-sticker' code='flower-heihei' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/flower/8.jpg'/></div><div class='emotion-item emotion-item-sticker' code='flower-lemon' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/flower/9.jpg'/></div><div class='emotion-item emotion-item-sticker' code='flower-birthday' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/flower/10.jpg'/></div><div class='emotion-item emotion-item-sticker' code='flower-sea' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/flower/11.jpg'/></div><div class='emotion-item emotion-item-sticker' code='flower-vegetable' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/flower/12.jpg'/></div><div class='emotion-item emotion-item-sticker' code='flower-tile' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/flower/13.jpg'/></div><div class='emotion-item emotion-item-sticker' code='flower-utf' title=''><img class='lazyload' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9Ii04IC04IDQwIDQwIiBzdHJva2U9IiM4ODgiIG9wYWNpdHk9Ii41IiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xNC44MjggMTQuODI4YTQgNCAwIDAxLTUuNjU2IDBNOSAxMGguMDFNMTUgMTBoLjAxTTIxIDEyYTkgOSAwIDExLTE4IDAgOSA5IDAgMDExOCAweiIvPgo8L3N2Zz4=' data-original='https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/stickers/flower/14.jpg'/></div><div class='emotion-group-description'>Source: github.com/k4yt3x/flowerhd</div></div> </div>
<div class="emotion-keyboard-bar">
<div class='emotion-group-name active' index='0'>颜文字</div><div class='emotion-group-name' index='1'>Emoji</div><div class='emotion-group-name' index='2'>小恐龙</div><div class='emotion-group-name' index='3'>花!</div> </div>
</div> </div>
</div>
<input id="post_comment_captcha_seed" value="" style="display: none;"></input>
<input id="post_comment_post_id" value="979" style="display: none;"></input>
</form>
</div>
</div>
<div id="comment_edit_history" class="modal fade" tabindex="-1" role="dialog" aria-modal="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" style="font-size: 20px;"></h4>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body" style="word-break: break-word;"></div>
</div>
</div>
</div>
<div id="comment_pin_comfirm_dialog" class="modal fade" tabindex="-1" role="dialog" aria-modal="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" style="font-size: 20px;"></h4>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body" style="word-break: break-word;"></div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary btn-dismiss" data-dismiss="modal"></button>
<button type="button" class="btn btn-primary btn-comfirm"></button>
</div>
</div>
</div>
</div>
<div class="post-navigation card shadow-sm"><div class="post-navigation-item post-navigation-pre"><span class="page-navigation-extra-text"><i class="fa fa-arrow-circle-o-left" aria-hidden="true"></i>上一篇</span><a href="https://wuxianglong.cn/qianduanhtmlliebiaobiaogemeitiyuansu/" rel="prev">007、前端_HTML 列表、表格、媒体元素</a></div><div class="post-navigation-item post-navigation-next"><span class="page-navigation-extra-text">下一篇 <i class="fa fa-arrow-circle-o-right" aria-hidden="true"></i></span><a href="https://wuxianglong.cn/qianduanhtmlbiaodan/" rel="next">009、前端_HTML 表单</a></div></div><div class="related-posts card shadow-sm">
<h2 class="post-comment-title" style="margin-top: 1.2rem;margin-left: 1.5rem;margin-right: 1.5rem;">
<i class="fa fa-book"></i>
<span>推荐文章</span>
</h2>
<div style="overflow-x: auto;padding: 1.5rem;padding-top: 0.8rem;padding-bottom: 0.8rem;}"><a class="related-post-card" href="https://wuxianglong.cn/duoxiancheng/"><div class="related-post-card-container">
<div class="related-post-title clamp" clamp-line="3">028、多线程</div>
<i class="related-post-arrow fa fa-chevron-right" aria-hidden="true"></i>
</div></a><a class="related-post-card" href="https://wuxianglong.cn/qianduancsshezimoxing/"><div class="related-post-card-container">
<div class="related-post-title clamp" clamp-line="3">004、前端_CSS 盒子模型</div>
<i class="related-post-arrow fa fa-chevron-right" aria-hidden="true"></i>
</div></a><a class="related-post-card" href="https://wuxianglong.cn/xmldom4j/"><div class="related-post-card-container">
<div class="related-post-title clamp" clamp-line="3">044、XML&Dom4j</div>
<i class="related-post-arrow fa fa-chevron-right" aria-hidden="true"></i>
</div></a><a class="related-post-card" href="https://wuxianglong.cn/javamianxiangduixiangjavajihekuangjiacollectionjiekou/"><div class="related-post-card-container">
<div class="related-post-title clamp" clamp-line="3">008、java面向对象_Java集合框架Collection接口</div>
<i class="related-post-arrow fa fa-chevron-right" aria-hidden="true"></i>
</div></a><a class="related-post-card" href="https://wuxianglong.cn/niyongguoneixielajihuishouqitamenyoushenmequbie/"><div class="related-post-card-container">
<div class="related-post-title clamp" clamp-line="3">025、你用过哪些垃圾回收器？它们有什么区别？</div>
<i class="related-post-arrow fa fa-chevron-right" aria-hidden="true"></i>
</div></a></div></div>
<footer id="footer" class="site-footer card shadow-sm border-0">
<style>
/* 核心样式 */
.github-badge {
display: inline-block;
border-radius: 4px;
text-shadow: none;
font-size: 13.1px;
color: #fff;
line-height: 15px;
margin-bottom: 5px;
font-family: "Open Sans", sans-serif;
}
.github-badge .badge-subject {
display: inline-block;
padding: 4px 4px 4px 6px;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
font-family: "Open Sans", sans-serif;
}
.github-badge .badge-value {
display: inline-block;
padding: 4px 6px 4px 4px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
font-family: "Open Sans", sans-serif;
}
.github-badge-big {
display: inline-block;
border-radius: 6px;
text-shadow: none;
font-size: 14.1px;
color: #fff;
line-height: 18px;
margin-bottom: 7px;
}
.github-badge-big .badge-subject {
display: inline-block;
padding: 4px 4px 4px 6px;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
.github-badge-big .badge-value {
display: inline-block;
padding: 4px 6px 4px 4px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
</style>
<div class="github-badge-big">
<span class="badge-subject"><i class="fa fa-id-card"></i> 备案号 </span
><span class="badge-value bg-apricots">
<a href="https://beian.miit.gov.cn/" target="_blank" one-link-mark="yes"
>粤ICP备2024188084号-1</a
>
</span
>
</div>
<div class="github-badge-big">
<span class="badge-subject"><i class="fa fa-clock-o"></i>运行时间</span
><span class="badge-value bg-apricots"
><span id="blog_running_days" class="odometer odometer-auto-theme"></span>
天
<span id="blog_running_hours" class="odometer odometer-auto-theme"></span> 时
<span id="blog_running_mins" class="odometer odometer-auto-theme"></span> 分
<span id="blog_running_secs" class="odometer odometer-auto-theme"></span>
秒</span
>
<script no-pjax="">
var blog_running_days = document.getElementById("blog_running_days");
var blog_running_hours = document.getElementById("blog_running_hours");
var blog_running_mins = document.getElementById("blog_running_mins");
var blog_running_secs = document.getElementById("blog_running_secs");
function refresh_blog_running_time() {
var time = new Date() - new Date(2017, 3,11, 10, 10, 0);
var d = parseInt(time / 24 / 60 / 60 / 1000);
var h = parseInt((time % (24 * 60 * 60 * 1000)) / 60 / 60 / 1000);
var m = parseInt((time % (60 * 60 * 1000)) / 60 / 1000);
var s = parseInt((time % (60 * 1000)) / 1000);
blog_running_days.innerHTML = d;
blog_running_hours.innerHTML = h;
blog_running_mins.innerHTML = m;
blog_running_secs.innerHTML = s;
}
refresh_blog_running_time();
if (typeof bottomTimeIntervalHasSet == "undefined") {
var bottomTimeIntervalHasSet = true;
setInterval(function () {
refresh_blog_running_time();
}, 500);
}
</script>
<div>Theme <a href="https://github.com/solstice23/argon-theme" target="_blank"><strong>Argon</strong></a></div>
</footer>
</main>
</div>
</div>
<script src="https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/argontheme.js?v1.3.5"></script>
<link rel="stylesheet" href="https://fastly.jsdelivr.net/gh/solstice23/argon-theme@1.3.5/assets/vendor/highlight/styles/vs2015.css">
</div>
</div>
<script type="text/javascript" src="https://wuxianglong.cn/wp-content/plugins/wp-githuber-md/assets/vendor/emojify/js/emojify.min.js?ver=1.1.0" id="emojify-js"></script>
<script id="module-emojify">
(function($) {
$(function() {
if (typeof emojify !== "undefined") {
emojify.setConfig({
img_dir: "https://wuxianglong.cn/wp-content/plugins/wp-githuber-md/assets/vendor/emojify/images",
blacklist: {
"classes": ["no-emojify"],
"elements": ["script", "textarea", "pre", "code"]
}
});
emojify.run();
} else {
console.log("[wp-githuber-md] emogify is undefined.");
}
});
})(jQuery);
</script>
<!--全页特效开始-->
<script src="https://cdn.jsdelivr.net/gh/huangwb8/bloghelper@latest/js/mobile-detect.js"></script>
<script type="text/javascript">
// 设备检测
var md = new MobileDetect(window.navigator.userAgent);
// PC生效，手机/平板不生效
// md.mobile(); md.phone();
if(!md.phone()){
if(!md.tablet()){
// 雪花
// $.getScript("https://cdn.jsdelivr.net/gh/huangwb8/bloghelper@latest/js/xiaxue.js");
// 樱花
// $.getScript("https://cdn.jsdelivr.net/gh/huangwb8/bloghelper@latest/js/yinghua.js");
// 小烟花特效
// $.getScript("https://cdn.jsdelivr.net/gh/huangwb8/bloghelper@latest/js/mouse-click.js");
// 大烟花特效
// $.getScript("https://cdn.jsdelivr.net/gh/huangwb8/bloghelper@latest/mouse/mouse-click-02/mouse-canvas.js");
// document.write('<style>#mouse-canvas {z-index:217483647; pointer-events: none; box-sizing: border-box !important; display: block !important; position: fixed !important; left: 0; right: 0; top: 0; bottom: 0; width: 100%; height: 100vh;}</style>')
// 鼠标移动的仙女棒特效
$.getScript("https://cdn.jsdelivr.net/gh/huangwb8/bloghelper@latest/mouse/halo-dream/fairyDustCursor.min.js");
// 鼠标移动的泡泡特效
// $.getScript("https://bensz.onmicrosoft.cn/bloghelper/mouse/joe/censor10.js");
}
}
</script>
<!--全页特效结束-->
</body>
</html>
<!-- Dynamic page generated in 0.289 seconds. -->
<!-- Cached page generated by WP-Super-Cache on 2024-05-14 08:18:14 -->
<!-- super cache -->
