<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>cnblogs</title>
<link rel="stylesheet" href="02%20blog样式.css">
</head>
<body>
<div class="blog-left">
<div class="blog-avatar">
<img src="222.png" alt="">
</div>
<div class="blog-title">
<p>dandan的个人博客</p>
</div>
<div class="blog-info">
<p>可爱的丹丹永远16岁!</p>
</div>
<div class="blog-link">
<ul>
<li><a href="">关于我</a></li>
<li><a href="">微博</a></li>
<li><a href="">微信公众号</a></li>
</ul>
</div>
<div class="blog-tag">
<ul>
<li><a href="">#Python</a></li>
<li><a href="">#Java</a></li>
<li><a href="">#Golang</a></li>
</ul>
</div>
</div>
<div class="blog-right">
<div class="article-list">
<div class="article-title">
<span class="title">宇宙造梦机</span>
<span class="date">2019/11/15</span>
</div>
<div class="article-content">
<p>明年有明年永无休止的时光,还有明年数不尽的生机。要记住,所有热爱的事情都要不遗余力呀!感谢你们曾为我们筑的梦,今后也要继续造梦啊。愿宇宙之中,梦想闪耀,光芒万丈!</p>
</div>
<div class="article-bottom">
<span>#Python </span>
<span>#JavaScript</span>
</div>
</div>
<div class="article-list">
<div class="article-title">
<span class="title">宇宙造梦机</span>
<span class="date">2019/11/15</span>
</div>
<div class="article-content">
<p>明年有明年永无休止的时光,还有明年数不尽的生机。要记住,所有热爱的事情都要不遗余力呀!感谢你们曾为我们筑的梦,今后也要继续造梦啊。愿宇宙之中,梦想闪耀,光芒万丈!</p>
</div>
<div class="article-bottom">
<span>#Python </span>
<span>#JavaScript</span>
</div>
</div>
<div class="article-list">
<div class="article-title">
<span class="title">宇宙造梦机</span>
<span class="date">2019/11/15</span>
</div>
<div class="article-content">
<p>明年有明年永无休止的时光,还有明年数不尽的生机。要记住,所有热爱的事情都要不遗余力呀!感谢你们曾为我们筑的梦,今后也要继续造梦啊。愿宇宙之中,梦想闪耀,光芒万丈!</p>
</div>
<div class="article-bottom">
<span>#Python </span>
<span>#JavaScript</span>
</div>
</div>
<div class="article-list">
<div class="article-title">
<span class="title">宇宙造梦机</span>
<span class="date">2019/11/15</span>
</div>
<div class="article-content">
<p>明年有明年永无休止的时光,还有明年数不尽的生机。要记住,所有热爱的事情都要不遗余力呀!感谢你们曾为我们筑的梦,今后也要继续造梦啊。愿宇宙之中,梦想闪耀,光芒万丈!</p>
</div>
<div class="article-bottom">
<span>#Python </span>
<span>#JavaScript</span>
</div>
</div>
<div class="article-list">
<div class="article-title">
<span class="title">宇宙造梦机</span>
<span class="date">2019/11/15</span>
</div>
<div class="article-content">
<p>明年有明年永无休止的时光,还有明年数不尽的生机。要记住,所有热爱的事情都要不遗余力呀!感谢你们曾为我们筑的梦,今后也要继续造梦啊。愿宇宙之中,梦想闪耀,光芒万丈!</p>
</div>
<div class="article-bottom">
<span>#Python </span>
<span>#JavaScript</span>
</div>
</div>
<div class="article-list">
<div class="article-title">
<span class="title">宇宙造梦机</span>
<span class="date">2019/11/15</span>
</div>
<div class="article-content">
<p>明年有明年永无休止的时光,还有明年数不尽的生机。要记住,所有热爱的事情都要不遗余力呀!感谢你们曾为我们筑的梦,今后也要继续造梦啊。愿宇宙之中,梦想闪耀,光芒万丈!</p>
</div>
<div class="article-bottom">
<span>#Python </span>
<span>#JavaScript</span>
</div>
</div>
<div class="article-list">
<div class="article-title">
<span class="title">宇宙造梦机</span>
<span class="date">2019/11/15</span>
</div>
<div class="article-content">
<p>明年有明年永无休止的时光,还有明年数不尽的生机。要记住,所有热爱的事情都要不遗余力呀!感谢你们曾为我们筑的梦,今后也要继续造梦啊。愿宇宙之中,梦想闪耀,光芒万丈!</p>
</div>
<div class="article-bottom">
<span>#Python </span>
<span>#JavaScript</span>
</div>
</div>
<div class="article-list">
<div class="article-title">
<span class="title">宇宙造梦机</span>
<span class="date">2019/11/15</span>
</div>
<div class="article-content">
<p>明年有明年永无休止的时光,还有明年数不尽的生机。要记住,所有热爱的事情都要不遗余力呀!感谢你们曾为我们筑的梦,今后也要继续造梦啊。愿宇宙之中,梦想闪耀,光芒万丈!</p>
</div>
<div class="article-bottom">
<span>#Python </span>
<span>#JavaScript</span>
</div>
</div>
<div class="article-list">
<div class="article-title">
<span class="title">宇宙造梦机</span>
<span class="date">2019/11/15</span>
</div>
<div class="article-content">
<p>明年有明年永无休止的时光,还有明年数不尽的生机。要记住,所有热爱的事情都要不遗余力呀!感谢你们曾为我们筑的梦,今后也要继续造梦啊。愿宇宙之中,梦想闪耀,光芒万丈!</p>
</div>
<div class="article-bottom">
<span>#Python </span>
<span>#JavaScript</span>
</div>
</div>
<div class="article-list">
<div class="article-title">
<span class="title">宇宙造梦机</span>
<span class="date">2019/11/15</span>
</div>
<div class="article-content">
<p>明年有明年永无休止的时光,还有明年数不尽的生机。要记住,所有热爱的事情都要不遗余力呀!感谢你们曾为我们筑的梦,今后也要继续造梦啊。愿宇宙之中,梦想闪耀,光芒万丈!</p>
</div>
<div class="article-bottom">
<span>#Python </span>
<span>#JavaScript</span>
</div>
</div>
<div class="article-list">
<div class="article-title">
<span class="title">宇宙造梦机</span>
<span class="date">2019/11/15</span>
</div>
<div class="article-content">
<p>明年有明年永无休止的时光,还有明年数不尽的生机。要记住,所有热爱的事情都要不遗余力呀!感谢你们曾为我们筑的梦,今后也要继续造梦啊。愿宇宙之中,梦想闪耀,光芒万丈!</p>
</div>
<div class="article-bottom">
<span>#Python </span>
<span>#JavaScript</span>
</div>
</div>
<div class="article-list">
<div class="article-title">
<span class="title">宇宙造梦机</span>
<span class="date">2019/11/15</span>
</div>
<div class="article-content">
<p>明年有明年永无休止的时光,还有明年数不尽的生机。要记住,所有热爱的事情都要不遗余力呀!感谢你们曾为我们筑的梦,今后也要继续造梦啊。愿宇宙之中,梦想闪耀,光芒万丈!</p>
</div>
<div class="article-bottom">
<span>#Python </span>
<span>#JavaScript</span>
</div>
</div>
<div class="article-list">
<div class="article-title">
<span class="title">宇宙造梦机</span>
<span class="date">2019/11/15</span>
</div>
<div class="article-content">
<p>明年有明年永无休止的时光,还有明年数不尽的生机。要记住,所有热爱的事情都要不遗余力呀!感谢你们曾为我们筑的梦,今后也要继续造梦啊。愿宇宙之中,梦想闪耀,光芒万丈!</p>
</div>
<div class="article-bottom">
<span>#Python </span>
<span>#JavaScript</span>
</div>
</div>
</div>
</body>
</html>
/*这是博客园首页样式文件*/
/*通用样式*/
body {
margin: 0;
background-color: #eeeeee;
}
a {
text-decoration: none;
}
ul {
list-style-type: none;
padding-left: 0;
}
/*左侧样式*/
.blog-left {
float: left;
width: 20%;
height: 100%;
background-color: #75f3ff;
position: fixed;
top: 0;
left: 0;
}
.blog-avatar {
border: 5px solid white;
border-radius: 50%;
height: 150px;
width: 150px;
margin: 20px auto;
overflow: hidden;
}
.blog-avatar img {
width: 100%;
}
.blog-title,.blog-info {
font-size: 14px;
color: #0b0ea9;
text-align: center;
}
.blog-link a,.blog-tag a {
color: #3635a9;
}
.blog-link a:hover,.blog-tag a:hover {
color: white;
}
.blog-link ul,.blog-tag ul {
text-align: center;
margin: 60px 0;
}
/*右侧样式*/
.blog-right {
float: right;
width: 80%;
height: 1000px;
}
.article-list {
background-color: white;
margin: 20px 40px 20px 10px;
box-shadow: 5px 5px 5px rgba(129,70,34,0.8);
}
.article-title {
border-left: 5px solid red;
}
.article-title .title {
font-size: 36px;
margin-left: 18px;
}
.article-title .date {
float: right;
margin: 20px;
}
.article-content p {
text-indent: 25px;
}
.article-content {
border-bottom: 1px solid black;
}
.article-bottom {
padding: 10px 20px 10px 20px;
}
原文:https://www.cnblogs.com/lidandanaa/p/11869963.html