<title></title>
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no ,width=device-width" />
<style type="text/css">
* {
margin: 0px auto;
padding: 0px;
}
body{
background: url(../img/afggffbfgh.jpg) repeat-y;
}
.header {
width: 800px;
}
.nav {
background: #888888;
height: 40px;
width: 800px;
border-radius: 5px;
}
.nav_ul {
list-style: none;
}
.nav_ul li {
float: left;
padding: 5px;
margin-top: 4px;
}
.search {
height: 30px;
border-radius: 5px;
margin-top: 3px;
float: right;
margin-right: 10px;
}
.main {
width: 800px;
height: 700px;
margin-top: 10px;
}
/*.img {
width: 500px;
height: 200px;
}*/
.article {
border-radius: 5px;
float: left;
background: #FFFFFF;
width: 600px;
}
.article img {
width: 100%;
height: 300px;
}
.article p {
padding: 5px;
color: #858585;
}
aside {
background: white;
width: 150px;
float: right;
border-radius: 5px;
}
.aside {
list-style: none;
padding: 5px;
}
@media only screen and (max-width: 800px) {
aside {
position: relative;
width: 600px;
right: 200px;
}
}
a:link {
color:black;
text-decoration:none;
}
a:visited {
color:deepskyblue;
text-decoration:none;
}
</style>
</head>
<body>
<header class="header">
<img src="../img/aaa.jpg" />
</header>
<nav class="nav">
<ul class="nav_ul">
<li><a href="#">主页</a></li>
<li><a href="#">主页</a></li>
<li><a href="#">主页</a></li>
<li><a href="#">主页</a></li>
</ul>
<input type="search" placeholder="请输入" class="search">
</nav>
<section class="main">
<!--
正文
-->
<article class="article">
<h2 class="h1" style="padding: 5px;">just a post title</h2>
<time style="padding: 5px;">2017-11-28</time><br>
<img src="../img/b - 副本.jpg" class="img" />
<p>
但是在那个浏览器大战的血腥年代里，这种情况就未必会发生，那时候对标准的支持并不是企业的优先选择。比方说，Netscape 4 就不支持继承，它不仅忽略继承，而且也忽略应用于 body 元素的规则。IE/Windows 直到 IE6 还存在相关的问题， 在表格内的字体样式会被忽略。我们又该如何是好呢
</p>
<video src="../video/111222.mp4" controls="controls" width="100%"></video>
</article>
<aside>
<ul class="aside">
<li>我的日志</li>
<li>我的日志</li>
<li>我的日志</li>
</ul>
</aside>
</section>
</body>
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no ,width=device-width" />
<style type="text/css">
* {
margin: 0px auto;
padding: 0px;
}
body{
background: url(../img/afggffbfgh.jpg) repeat-y;
}
.header {
width: 800px;
}
.nav {
background: #888888;
height: 40px;
width: 800px;
border-radius: 5px;
}
.nav_ul {
list-style: none;
}
.nav_ul li {
float: left;
padding: 5px;
margin-top: 4px;
}
.search {
height: 30px;
border-radius: 5px;
margin-top: 3px;
float: right;
margin-right: 10px;
}
.main {
width: 800px;
height: 700px;
margin-top: 10px;
}
/*.img {
width: 500px;
height: 200px;
}*/
.article {
border-radius: 5px;
float: left;
background: #FFFFFF;
width: 600px;
}
.article img {
width: 100%;
height: 300px;
}
.article p {
padding: 5px;
color: #858585;
}
aside {
background: white;
width: 150px;
float: right;
border-radius: 5px;
}
.aside {
list-style: none;
padding: 5px;
}
@media only screen and (max-width: 800px) {
aside {
position: relative;
width: 600px;
right: 200px;
}
}
a:link {
color:black;
text-decoration:none;
}
a:visited {
color:deepskyblue;
text-decoration:none;
}
</style>
</head>
<body>
<header class="header">
<img src="../img/aaa.jpg" />
</header>
<nav class="nav">
<ul class="nav_ul">
<li><a href="#">主页</a></li>
<li><a href="#">主页</a></li>
<li><a href="#">主页</a></li>
<li><a href="#">主页</a></li>
</ul>
<input type="search" placeholder="请输入" class="search">
</nav>
<section class="main">
<!--
正文
-->
<article class="article">
<h2 class="h1" style="padding: 5px;">just a post title</h2>
<time style="padding: 5px;">2017-11-28</time><br>
<img src="../img/b - 副本.jpg" class="img" />
<p>
但是在那个浏览器大战的血腥年代里，这种情况就未必会发生，那时候对标准的支持并不是企业的优先选择。比方说，Netscape 4 就不支持继承，它不仅忽略继承，而且也忽略应用于 body 元素的规则。IE/Windows 直到 IE6 还存在相关的问题， 在表格内的字体样式会被忽略。我们又该如何是好呢
</p>
<video src="../video/111222.mp4" controls="controls" width="100%"></video>
</article>
<aside>
<ul class="aside">
<li>我的日志</li>
<li>我的日志</li>
<li>我的日志</li>
</ul>
</aside>
</section>
</body>
5万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
