如何使用“html”制作侧边栏和新页面？

Question

我是一名大学生，我必须设计一个网站作为我的项目。我们可以由网站设计师设计一个网页，但我自己编写了所有 html 代码；但现在我有一些问题：

1. 我无法创建侧边栏
2. 我无法创建新页面。
3. 我需要几周的免费主机和域名。 如果有人帮助我，我将不胜感激（（：

我使用了一个网站并输入了代码，但它不起作用。 我找不到主机和域名。

Answer 1

当然，我很乐意提供更流畅的解释：

创建侧边栏： 要向您的网站添加侧边栏，您可以利用 HTML 和 CSS 的强大功能。让我们创建一个既具有视觉吸引力又实用的基本侧边栏布局：

在您的 HTML 文件中：

<div class="sidebar">
    <ul>
        <li><a href="index.html">Home</a></li>
        <li><a href="about.html">About</a></li>
        <li><a href="contact.html">Contact</a></li>
    </ul>
</div>
<div class="content">
    <!-- Your main content will fit nicely here -->
</div>

然后，在你的 CSS 文件中：

.sidebar {
    width: 250px;
    background-color: #f1f1f1;
    padding: 20px;
}

.sidebar ul {
    list-style-type: none;
    padding: 0;
}

.sidebar li {
    margin-bottom: 10px;
}

.sidebar a {
    text-decoration: none;
    color: #333;
}

创建新页面： 使用新页面扩展您的网站非常简单。例如，假设您希望引入“关于”页面。您需要做的就是制作一个新的 HTML 文件，例如

about.html

，并为其提供必要的 HTML 代码。同样的方法适用于任何其他页面。

免费托管和域名： 令人高兴的是，有几个平台通过免费托管和子域名来扩展他们的慷慨，使您的网络之旅更加顺畅：

• GitHub Pages： 使用 GitHub Pages 轻松托管您的网站。通过创建存储库并上传 HTML 和 CSS 文件，您的网站将可以通过像

  username.github.io

  这样的子域访问。

• Netlify：另一个很棒的选择是Netlify，提供免费的托管和域功能。通过将 GitHub 存储库连接到 Netlify，您可以无缝部署您的站点。

• Vercel： 与 Netlify 非常相似，Vercel 使您能够免费托管网站，并通过 GitHub 集成提供简单的部署。

• InfinityFree： 该平台提供了引人注目的免费托管和子域名组合。

首先，您通常需要在所选平台上创建一个帐户，按照其部署说明进行操作，并根据需要配置您的域/子域。

您可以根据您的项目的美观和要求随意定制提供的代码片段。如果您在将这些解决方案付诸实施时遇到任何障碍，请随时寻求进一步的帮助 – 我随时为您提供帮助！