<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>耿晴 -- 个人首页</title>
</head>
<style type="text/css">
* {
box-sizing: border-box;
}
/* body 样式 */
body {
font-family: Arial;
margin: 0;
}
/* 标题 */
.header {
padding: 80px;
text-align: center;
background:url(https://images.cnblogs.com/cnblogs_com/blogs/690905/galleries/2128405/o_220320050614_%E5%A4%A7%E6%B5%B7.jpg);
background-size:cover;
color: white;
}
/* 标题字体加大 */
.header h1 {
font-size: 40px;
}
/* 导航 */
.navbar {
overflow: hidden;
background-color: #66CCCC;
}
/* 导航栏样式 */
.navbar a {
border-radius:30px;
float: left;
display: block;
color: white;
text-align: center;
padding: 14px 20px;
text-decoration: none;
}
.zuo{
width: 280px;
height: 1000px;
border-radius:30px;
border:10px solid #d2dcf9;
background:url(https://images.cnblogs.com/cnblogs_com/blogs/690905/galleries/2128405/o_220320050654_%E9%A3%8E%E6%99%AF3.jpg);
background-size:cover;
display: inline-block;
float: left;
position: relative;
}
.you{
position:relative
width: 1000px;
height: 1000px;
border-radius:30px;
border:10px solid #d2dcf9;
background:url(https://images.cnblogs.com/cnblogs_com/blogs/690905/galleries/2128405/o_220320050723_%E6%A0%91%E4%B8%8B.jpg);
background-size:cover;
display: inline-block;
margin-left:10px;
}
.limian{
text-align:center;/*文本居中*/
position: absolute;
left: 0;
right: 0;
top: 0;
margin: auto;
width:200px;
height:400px;
border-radius:15px;
border:14px solid #008080;
color: #008080;
div img{ 'height='180px' width=180px''};
}
</style>
<body>
<div class="header">
<h1>耿牛牛的院子</h1>
<p>Welcome to my world!</p>
<p>泰兰德的夏天永不停歇，我爱的少年永远热恋</p>
</div>
<div class="navbar">
<a href="file:///E:\实验一 信2005-1 耿晴20204010\实验一 PHP 信2005-1 耿晴20204010.html"><span>主页</span></a>
<a href="https://www.cnblogs.com/gnn40036/"><span>博客园</span></a>
<a href="https://www.cnblogs.com/gnn40036/gallery/2128405.html"><span>小世界</span></a>
<a href="https://msg.cnblogs.com/send/%E6%B8%85%E6%A2%A6%E9%9F%B6%E5%8D%8E"><span>留言板</span></a>
</div>
<div class="zuo">
<div class="limian">
<a href="https://www.cnblogs.com/gnn40036/"><span>博客园</span></a>
<ul1>
<li>姓名： 耿晴</li>
<li>班级：信2005-1</li>
<li>性别：女</li>
<li>专业：软件工程</li>
<li>学院：信息技术与科学学院</li>
</ul>
</div>
</div>
<div class="you">
<div class="dayTitle"style="width: 900px;
height: 50px;" >
<a href="https://www.cnblogs.com/gnn40036/archive/2022/03/19.html">2022年3月19日</a>
</div>
<div class="postTitle" role="heading" aria-level="2" style="width: 900px;
height: 30px;">
<a class="postTitle2 vertical-middle" href="https://www.cnblogs.com/gnn40036/p/15991193.html">
<span>
CSS
</span>
</a>
</div>
<div style="width: 900px; height: 50px;">
<div style="width: 900px; height: 50px;">
摘要：
如何使用CSS CSS 是在 HTML 4 开始使用的,是为了更好的渲染HTML元素而引入的. CSS 可以通过以下方式添加到HTML中: 内联样式- 在HTML元素中使用"style" 属性 内部样式表 -在HTML文档头部 <head> 区域使用<style> 元素 来包含CSS 外部引用 -
<a href="https://www.cnblogs.com/gnn40036/p/15991193.html" class="c_b_p_desc_readmore">阅读全文</a>
</div>
</div>
<div style="width: 900px;height: 10px;"></div>
<div style="width: 900px;height: 50px;" >posted @ 2022-03-19 20:41
清梦韶华
<span data-post-id="15991193" class="post-view-count">阅读(5)</span>
<span data-post-id="15991193" class="post-comment-count">评论(0)</span>
<span data-post-id="15991193" class="post-digg-count">推荐(0)</span>
<a href="https://i.cnblogs.com/EditPosts.aspx?postid=15991193" rel="nofollow">
编辑
</a>
</div>
<div style="width: 900px;height: 50px;"><a href="https://www.cnblogs.com/gnn40036/" >查看更多</a></div>
</div>
</div>
</body>
</html>
