推荐开源项目:cursoemvideo-html5 - 免费的HTML5与CSS3学习资源
项目名称:cursoemvideo-html5
项目描述:提供免费的HTML5与CSS3学习资源。
项目地址:https://github.com/cursoemvideo/cursoemvideo-html5
解决方案:
<!-- index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>示例页面</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<h1>我的网站</h1>
</header>
<nav>
<!-- 导航栏内容 -->
</nav>
<section>
<article>
<h2>文章标题</h2>
<p>这里是文章内容...</p>
</article>
<!-- 其他文章 -->
</section>
<aside>
<!-- 侧边栏内容 -->
</aside>
<footer>
<!-- 页脚内容 -->
</footer>
</body>
</html>
/* style.css */
body {
font-family: Arial, sans-serif;
}
header, footer {
background-color: #eee;
padding: 10px 0;
text-align: center;
}
nav, aside {
/* 布局相关样式 */
}
section article {
padding: 15px;
margin-bottom: 10px;
background-color: #f9f9f9;
border: 1px solid #ddd;
}
以上代码提供了一个简单的HTML5结构和对应的CSS样式,可以作为学习HTML5和CSS3的参考。
评论已关闭