交作业！
就爱看你发的截图{:10_256:} <!doctype>
<html>
<head>
<title>
第十五题
</title>
</head>
<body>
<header>
<h1>吴玉斌工作室</h1>
<nav>
<ul>
<li>门户</li>
<li>论坛</li>
<li>空间</li>
<li>VIP通道</li>
</ul>
</nav>
</header>
<section>
<h2>小天才养殖场</h2>
<article>
<h3>0 1 0 9 - 第一季收官 - 【完结撒花】</h3>
<p>XXXXX文章内容XXX</p>
</article>
<article>
<h3>XXXXX文章内容XXX</h3>
<p>XXXXXXxxxxxx</p>
</article>
</section>
<section>
<h2>吹水阁</h2>
<article>
<h3>2017 #吹水阁 - 16 - 扯淡汇报 - 文末彩蛋 | 【欢迎群P(喷)】</h3>
<p>XXXxxxxxx</p>
</article>
<article>
<h3>VIP至尊会员~请进，有个‘福利’偷偷给你哈～</h3>
<p>XXXX谁办谁知道</p>
</article>
</section>
<section>
<h2>QT交流</h2>
<article>
<h3> FFFF - Qt大全 - 官网、论坛、GitHub - 【深度扫盲】</h3>
<p>经典毋庸置疑</p>
<h3>156-三位一体进进出出-【147-155】</h3>
<p>建议18岁以上再看</p>
</article>
<article>
<head>
优化article
</head>
<meta charset="utf-8">
<header>
<h3>响应小甲鱼老湿号召~|为什么我要变成VIP至尊？！@EveryOne</h3>
</header>
<p>你的选择决定你的时间,而你的时间<br>决定你的注意力<br>你最宝贵的注意力自然分清未来你会待在哪个阶层！<br>让编程改变世界!<br>欢迎你的加入!<br>我在这里等你!</p>
<footer>
<p>文章发表日期：<time datetime="2016-11-5 15:22:03">2016年11月5日 15:22:03</time></p>
</footer>
</article>
</section>
<aside>
<h2>小天才养殖场</h2>
<p>热帖名字</p>
</aside>
<aside>
<h2>吹水阁经典贴</h2>
<p>热帖名字</p>
</aside>
<aside>
<h2>qt热帖交流</h2>
<p>热帖名字</p>
</aside>
<footer>
<p>鱼C版权所有 2017</p>
<a href="http://bbs.fishc.com/forum-171-1.html">投诉区</a>
</footer>
</body>
</html> 同问以上楼上的2个问题 土耳其东木白 发表于 2018-5-29 17:20
为什么侧边栏展示在脚下，这个没看懂
同问 Ъγ:_小ツ雨oο 发表于 2017-5-29 16:49
代码 中 最终代码section没放在body里，是不是写错了 http://bbs.fishc.com/forum.php?mod=viewthread& ...
同问 <!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>body区块</title>
</head>
<body>
<header><!--头部区域-->
<h1>导航</h1>
<nav><!--菜单导航-->
<ul>
<li>首页</li>
<li>门户</li>
<li>论坛</li>
<li>空间</li>
<li>VIP空间</li>
</ul>
</nav>
</header>
<section>
<h2>内容板块A</h2>
<article>
<header>
<h3>第一章</h3>
</header>
<p>文章内容</p>
<footer>
<p>发表日期：<time datetime="2019-03-29 09:00:00">2019-03-29 09:00:00</time></p>
</footer>
</article>
</section>
<section>
<h2>内容板块B</h2>
<article>
<h3>第一话</h3>
<p>文章内容</p>
</article>
</section>
<section>
<h2>内容板块C</h2>
<article>
<h3>第一幕</h3>
<p>文章内容</p>
</article>
</section>
<aside><!--侧边栏-->
<h2>小天才养殖场热帖推荐</h2>
<p>热帖名称</p>
</aside>
<aside>
<h2>吹水阁经典热贴</h2>
<p>热帖名称</p>
</aside>
<aside>
<h2>QT交流热帖</h2>
<p>热帖名称</p>
</aside>
<footer><!--页脚区域，放置版权声明、外部连接-->
<p>Z版权所有2019</p>
<a >投诉区</a>
</footer>
</body> <!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
body{
padding-left:200px;
}
ul{
margin: 0;
padding: 0;
}
li{
list-style: none;
}
</style>
</head>
<body>
<header>
<h1>鱼c工作室</h1>
<nav>
<ul>
<li>门户</li>
<li>论坛</li>
<li>空间</li>
<li>vip通道</li>
</ul>
</nav>
</header>
<main>
<section>
<h2>命本无曲路</h2>
<article>
<h3>遇见</h3>
<p>重逢的季节多花雨</p>
</article>
<article>
<h3> 相望</h3>
<p>江湖相知亦可相望</p>
</article>
</section>
<section>
<h2>安可留人心</h2>
<article>
<h3>遇见</h3>
<p>重逢的季节多花雨</p>
</article>
<article>
<h3> 相望</h3>
<p>江湖相知亦可相望</p>
</article>
</section>
<section>
<h2>--.--</h2>
<article>
<header>
<h3>响应小甲鱼老湿号召~|为什么我要变成VIP至尊？！@EveryOne</h3>
</header>
<p>你的选择决定你的时间,而你的时间<br>决定你的注意力<br>你最宝贵的注意力自然分清未来你会待在哪个阶层！<br>让编程改变世界!<br>欢迎你的加入!<br>我在这里等你!
</p>
<footer>
<p>文章发表日期：<time datetime="2016-11-5 15:22:03">2016年11月5日 15:22:03</time></p>
</footer>
</article>
</section>
</main>
<aside>
<h2>小天才养殖场热贴推荐</h2>
<p>热贴名字</p>
</aside>
<aside>
<h2>吹水阁经典热贴</h2>
<p>热贴名字</p>
</aside>
<aside>
<h2>Qt交流热贴</h2>
<p>热贴名字</p>
</aside>
<footer>
<p>鱼C版权所有 2017</p>
<a href="http://bbs.fishc.com/forum-171-1.html">投诉区</a>
</footer>
</body>
</html>
guohuo888meng@1 发表于 2019-2-12 10:26
同问
这里只是介绍h5新标签的语义
布局还要再添加css样式 <head>
<meta charser="utf-8">
<title>让编程改变世界</title>
<style>
h1 {
color:cadetblue;
text-align: center;
}
ul {
list-style: none;
}
li {
margin: auto 10px;
display: block;
float:left;
color:orangered;
}
h2 {
color: orangered;
}
article {
color: gray;
}
aside {
color:green;
}
p {
color:indianred;
}
a {
text-decoration:none;
color:pink;
font-size: 10px;
/*偷偷藏起来*/
}
</style>
</head>
<body>
<header>
<meta charset="utf-8">
<h1>鱼C工作室</h1>
<nav>
<ul>
<li>门户</li>
<li>论坛</li>
<li>空间</li>
<li>VIP通道</li>
</ul>
</nav>
</header>
<br>
<hr>
</body>
<section>
<h2>小天才养殖场</h2>
<article>
<h3> 0 1 0 9 - 第一季收官 - 【完结撒花】</h3>
<p>XXXXX文章内容XXX</p>
</article>
<article>
<h3> 阅读，返鱼币 | 【告知】</h3>
<p>XXXXXXxxxxxx</p>
</article>
</section>
<section>
<h2>吹水阁</h2>
<article>
<h3>2017 #吹水阁 - 16 - 扯淡汇报 - 文末彩蛋 | 【欢迎群P(喷)】</h3>
<p>XXXxxxxxx</p>
</article>
<article>
<h3>VIP至尊会员~请进，有个‘福利’偷偷给你哈～</h3>
<p>XXXX谁办谁知道</p>
</article>
</section>
<section>
<h2>Qt交流</h2>
<article>
<h3> FFFF - Qt大全 - 官网、论坛、GitHub - 【深度扫盲】</h3>
<p>经典毋庸置疑</p>
<h3>156-三位一体进进出出-【147-155】</h3>
<p>建议18岁以上再看</p>
</article>
</section>
<aside>
<h2>小天才养殖场热贴推荐</h2>
<p>热贴名字</p>
</aside>
<aside>
<h2>吹水阁经典热贴</h2>
<p>热贴名字</p>
</aside>
<aside>
<h2>Qt交流热贴</h2>
<p>热贴名字</p>
</aside>
<footer>
<p>鱼C版权所有 2017</p>
<a href="http://bbs.fishc.com/forum-171-1.html">投诉区</a>
</footer>
为什么侧边栏不在侧面 而是内容的下面 爱了爱了 <!doctype html>
<html>
<head>
<title>..</title>
<meta charset="UTF-8">
<style>
body{
background-image:url("test.jpg")
}
</style>
</head>
<body>
<header><h1>鱼c工作室</h1></header>
<nav><p>导航栏</p>
<ul>
<li>门户</li>
<li>论坛</li>
<li>空间</li>
<li>vip通道</li>
</ul>
</nav>
<main>
<section>
<h2>小天才养殖场</h2>
<h3>0109-第一季收官-完结撒花</h3>
<article>xxx文章内容xxx</article>
<h3>阅读反鱼币</h3>
<article>xxx文章内容xxx</article>
</section>
<section>
<h2>吹水阁</h2>
<h3>2017#吹水阁-16-扯淡汇报-文末彩蛋！</h3>
<article>xxx文章内容xxx</article>
<h3>VIP至尊会员</h3>
<article>xxx文章内容xxx</article>
</section>
<section>
<h2>qt交流</h2>
<h3>ffff-qt大全-官网，论坛，github</h3>
<article>经典毋庸置疑</article>
<h3>156-三位一体进进出出</h3>
<article>18岁以上观看</article
</section>
<aside>
<h2>小天才养殖场热帖推荐</h2>
<p>热帖名字</p>
<h2>吹水阁经典热帖</h2>
<p>热帖名字</p>
<h2>qt交流热帖</h2>
<p>热帖名字</p>
</aside>
</main>
<footer>
鱼c版权所有 2020
<p><a href="http://bbs.fishc.com">投诉区</a></p>
</footer>
</body>
</html> {:10_257:}
页:
1
[2]