代码拉取完成,页面将自动刷新
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>博客标签页</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/semantic-ui@2.5.0/dist/semantic.min.css">
<link rel="stylesheet" href="./static/css/me.css">
<script src="https://cdn.jsdelivr.net/npm/jquery@3.2/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/semantic-ui@2.5.0/dist/semantic.min.js"></script>
</head>
<body>
<!-- 导航 -->
<nav class="ui inverted segment m-padded-tb-mini m-shadow-small">
<div class="ui container">
<div class="ui inverted secondary stackable menu ">
<h2 class="ui teal header item">Blog</h2>
<a href="#" class="m-item item m-mobile-hide "><i class=" home icon"></i>首页</a>
<a href="#" class="m-item item m-mobile-hide "><i class=" idea icon"></i>分类</a>
<a href="#" class="active item m-mobile-hide "><i class=" tags icon"></i>标签</a>
<a href="#" class="m-item item m-mobile-hide "><i class=" clone icon"></i>归档</a>
<a href="#" class="m-item item m-mobile-hide "><i class=" info icon"></i>关于我</a>
<div class="right m-item item m-mobile-hide ">
<div class="ui icon transparent input">
<input type="text" name="" id="" placeholder="Search...">
<i class="search link inverted icon"></i>
</div>
</div>
</div>
</div>
<div>
<a href="#" class="ui menu toggle black icon button m-top-right m-mobile-show">
<i class="sidebar icon"></i>
</a>
</div>
</nav>
<!-- 中间内容 content -->
<div class="m-container-small m-padded-tb-big">
<div class="ui container">
<!-- header -->
<div class="ui attached segment">
<div class="ui two column grid middle aligned">
<div class="column">
<h3 class="ui teal header">标签</h3>
</div>
<div class="right aligned column">
共<h3 class="ui orange header m-inline-block m-text-thin">14</h3>个
</div>
</div>
</div>
<!-- content -->
<div class="ui attached segment m-padded-tb-large">
<a href="#" target="_blank" class="ui teal basic left large label m-margin-tb-tiny">方法论
<div class="detail">24</div>
</a>
<a href="#" target="_blank" class="ui basic left large label m-margin-tb-tiny">方法论
<div class="detail">20</div>
</a>
<a href="#" target="_blank" class="ui basic left large label m-margin-tb-tiny">方法论
<div class="detail">20</div>
</a>
<a href="#" target="_blank" class="ui basic left large label m-margin-tb-tiny">方法论
<div class="detail">20</div>
</a>
<a href="#" target="_blank" class="ui basic left large label m-margin-tb-tiny">方法论
<div class="detail">20</div>
</a>
<a href="#" target="_blank" class="ui basic left large label m-margin-tb-tiny">方法论
<div class="detail">20</div>
</a>
<a href="#" target="_blank" class="ui basic left large label m-margin-tb-tiny">方法论
<div class="detail">20</div>
</a>
<a href="#" target="_blank" class="ui basic left large label m-margin-tb-tiny">方法论
<div class="detail">20</div>
</a>
<a href="#" target="_blank" class="ui basic left large label m-margin-tb-tiny">方法论
<div class="detail">20</div>
</a>
<a href="#" target="_blank" class="ui basic left large label m-margin-tb-tiny">方法论
<div class="detail">20</div>
</a>
<a href="#" target="_blank" class="ui basic left large label m-margin-tb-tiny">方法论
<div class="detail">20</div>
</a>
<!-- book-list -->
</div>
<div class=" m-container ">
<div class="ui container">
<div class="ui stackable grid">
<!-- 博客列表 -->
<div class="eleven wide column m-margin-top-small">
<!-- content -->
<div class="ui teal attached segment m-padded-tb-large">
<div class="ui padded vertical segment">
<div class="ui mobile reversed stackable grid">
<div class="row">
<div class="eleven wide column">
<h3 class="ui header">难度很大胡苏杠</h3>
<p class="m-text">自动安装/卸载
推荐使用自动安装。
自动安装程序支持 Visual C++ 6.0 / 2008 ~ 2019。
安装方法:
1. 双击下载的 EasyX 安装包,在“Windows 已保护你的电脑”提示窗中,点“更多信息”,再点“仍要运行”,这时,可以看到 EasyX 的安装程序。</p>
<a href="https://picsum.photos">https://picsum.photos/200/250</a>
<div class="ui grid">
<div class="eleven wide column">
<div class="ui mini horizontal link list">
<div class="item">
<img src="https://picsum.photos/100/100" alt="" class="ui avatar image">
<div class="content">
<a class="header">李盈盈</a>
</div>
</div>
<div class="item">
<i class="calender icon"></i>2023-2-22
</div>
<div class="item">
<i class="eye icon"></i>2450
</div>
</div>
</div>
<div class="right aligned five wide column">
<a href="#" target="_blank" class="teal basic ui label">认知升级</a>
</div>
</div>
</div>
<div class="right aligned five wide column">
<a href="#" target="_blank">
<img src="https://picsum.photos/200/200" alt="" class="ui rounded image">
</a>
</div>
</div>
<div class="row">
<div class="column m-padded-tb-mini">
<a href="" class="ui mini basic orange left label m-text-thin">方法论</a>
</div>
</div>
</div>
</div>
</div>
<div class="ui teal attached segment m-padded-tb-large">
<div class="ui padded vertical segment">
<div class="ui mobile reversed stackable grid">
<div class="row">
<div class="eleven wide column">
<h3 class="ui header">难度很大胡苏杠</h3>
<p class="m-text">自动安装/卸载
推荐使用自动安装。
自动安装程序支持 Visual C++ 6.0 / 2008 ~ 2019。
安装方法:
1. 双击下载的 EasyX 安装包,在“Windows 已保护你的电脑”提示窗中,点“更多信息”,再点“仍要运行”,这时,可以看到 EasyX 的安装程序。</p>
<a href="https://picsum.photos">https://picsum.photos/200/250</a>
<div class="ui grid">
<div class="eleven wide column">
<div class="ui mini horizontal link list">
<div class="item">
<img src="https://picsum.photos/100/100" alt="" class="ui avatar image">
<div class="content">
<a class="header">李盈盈</a>
</div>
</div>
<div class="item">
<i class="calender icon"></i>2023-2-22
</div>
<div class="item">
<i class="eye icon"></i>2450
</div>
</div>
</div>
<div class="right aligned five wide column">
<a href="#" target="_blank" class="teal basic ui label">认知升级</a>
</div>
</div>
</div>
<div class="right aligned five wide column">
<a href="#" target="_blank">
<img src="https://picsum.photos/200/200" alt="" class="ui rounded image">
</a>
</div>
</div>
<div class="row">
<div class="column m-padded-tb-mini">
<a href="" class="ui mini basic orange left label m-text-thin">方法论</a>
</div>
</div>
</div>
</div>
</div>
<div class="ui teal attached segment m-padded-tb-large">
<div class="ui padded vertical segment">
<div class="ui mobile reversed stackable grid">
<div class="row">
<div class="eleven wide column">
<h3 class="ui header">难度很大胡苏杠</h3>
<p class="m-text">自动安装/卸载
推荐使用自动安装。
自动安装程序支持 Visual C++ 6.0 / 2008 ~ 2019。
安装方法:
1. 双击下载的 EasyX 安装包,在“Windows 已保护你的电脑”提示窗中,点“更多信息”,再点“仍要运行”,这时,可以看到 EasyX 的安装程序。</p>
<a href="https://picsum.photos">https://picsum.photos/200/250</a>
<div class="ui grid">
<div class="eleven wide column">
<div class="ui mini horizontal link list">
<div class="item">
<img src="https://picsum.photos/100/100" alt="" class="ui avatar image">
<div class="content">
<a class="header">李盈盈</a>
</div>
</div>
<div class="item">
<i class="calender icon"></i>2023-2-22
</div>
<div class="item">
<i class="eye icon"></i>2450
</div>
</div>
</div>
<div class="right aligned five wide column">
<a href="#" target="_blank" class="teal basic ui label">认知升级</a>
</div>
</div>
</div>
<div class="right aligned five wide column">
<a href="#" target="_blank">
<img src="https://picsum.photos/200/200" alt="" class="ui rounded image">
</a>
</div>
</div>
<div class="row">
<div class="column m-padded-tb-mini">
<a href="" class="ui mini basic orange left label m-text-thin">方法论</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<br>
<br>
<br>
<br>
</div>
</div>
</div>
<!-- 底部footer -->
<footer class="ui inverted vertical segment m-padded-tb-massive">
<div class="ui center aligned container">
<div class="ui divided inverted stackable grid">
<div class="three wide column">
<div class="ui inverted link list">
<div class="item">
<img src="./static/images/1.jpg" alt="" class="ui rounded image" style="width: 110px;">
</div>
</div>
</div>
<div class="three wide column">
<h4 class="m-opactiy-mini m-text-thin ui inverted header">最新新闻</h4>
<div class="ui inverted link list">
<a href="#" class="item">用户故事{User Story}</a>
<a href="#" class="item">用户故事{User Story}</a>
<a href="#" class="item">用户故事{User Story}</a>
</div>
</div>
<div class="three wide column">
<h4 class="m-opactiy-mini m-text-thin ui inverted header">最新新闻</h4>
<div class="ui inverted link list">
<a href="#" class="item">用户故事{User Story}</a>
<a href="#" class="item">用户故事{User Story}</a>
<a href="#" class="item">用户故事{User Story}</a>
</div>
</div>
<div class="seven wide column">
<h4 class="m-opactiy-mini m-text-thin ui inverted header">最新新闻</h4>
<p class="m-opactiy-mini">山行野宿,孤身万里 ...</p>
</div>
</div>
<div class="ui inverted section divider"></div>
<p class="m-text-spaced .m-opacity-tiny m-text-thin">---------这世间本就是各人下雪,各有各的隐晦皎洁---------</p>
</div>
</footer>
<script>
$('.menu.toggle').click(function(){
$('.m-item').toggleClass('m-mobile-hide');
});
</script>
</body>
</html>
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。