📜  github-pages main.css 取消 - CSS (1)

📅  最后修改于: 2023-12-03 15:30:58.315000             🧑  作者: Mango

Github Pages 主题介绍:取消 Main.css 样式

什么是 Github Pages?

Github Pages 是 Github 提供的一个快捷的静态网站托管服务,开发者可以通过 Github Pages 随意地发布、部署、维护自己的网站。它还简单易学,有完善的社群,是个值得使用的工具。

Github Pages 主题

Github Pages 允许用户自定义网站的样式。你可以从 Github Pages 主题库中选取一个喜欢的主题,也可以使用自己的 CSS 自定义样式。

这篇文章将介绍如何取消 Github Pages 中默认的 Main.css 样式。

取消 Main.css 样式

Github Pages 在制作网站时会自动引用 Main.css 样式,在大多数情况下它很重要,但有时候也可能会带来一些不必要的问题。

取消 Main.css 样式的方法很简单:

  1. 在你的仓库下新建一个名为 _layouts 的文件夹。

    mkdir _layouts
    
  2. _layouts 中新建一个名为 default.html 的文件,并复制以下内容到文件中:

    <!DOCTYPE html>
    <html>
    <head>
      {% if page.title %}
      <title>{{ page.title | escape }}</title>
      {% else %}
      <title>{{ site.title | escape }}</title>
      {% endif %}
    
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <link rel="stylesheet" href="{{ site.url }}/style.css">
    </head>
    <body>
      {{ content }}
    </body>
    </html>
    
  3. 创建 style.css 文件并在文件末尾加上以下代码:

    /* 取消 Main.css 样式 */
    body {
        margin: 0;
        padding: 0;
    }
    
    h1, h2, h3, h4, h5, h6 {
        margin: 0;
        padding: 0;
    }
    
    img {
        max-width: 100%;
        height: auto;
    }
    

现在,你的 Github Pages 不再默认引用 Main.css 样式,可以自由地使用自己的 CSS 样式表。

Markdown 格式代码片段
# Github Pages 主题介绍:取消 Main.css 样式

## 什么是 Github Pages?

Github Pages 是 Github 提供的一个快捷的静态网站托管服务,开发者可以通过 Github Pages 随意地发布、部署、维护自己的网站。它还简单易学,有完善的社群,是个值得使用的工具。

## Github Pages 主题

Github Pages 允许用户自定义网站的样式。你可以从 Github Pages 主题库中选取一个喜欢的主题,也可以使用自己的 CSS 自定义样式。

这篇文章将介绍如何取消 Github Pages 中默认的 Main.css 样式。

## 取消 Main.css 样式

Github Pages 在制作网站时会自动引用 Main.css 样式,在大多数情况下它很重要,但有时候也可能会带来一些不必要的问题。

取消 Main.css 样式的方法很简单:

1. 在你的仓库下新建一个名为 `_layouts` 的文件夹。

    ```
    mkdir _layouts
    ```

2. 在 `_layouts` 中新建一个名为 `default.html` 的文件,并复制以下内容到文件中:

    ```html
    <!DOCTYPE html>
    <html>
    <head>
      {% if page.title %}
      <title>{{ page.title | escape }}</title>
      {% else %}
      <title>{{ site.title | escape }}</title>
      {% endif %}
  
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <link rel="stylesheet" href="{{ site.url }}/style.css">
    </head>
    <body>
      {{ content }}
    </body>
    </html>
    ```

3. 创建 `style.css` 文件并在文件末尾加上以下代码:

    ```css
    /* 取消 Main.css 样式 */
    body {
        margin: 0;
        padding: 0;
    }

    h1, h2, h3, h4, h5, h6 {
        margin: 0;
        padding: 0;
    }

    img {
        max-width: 100%;
        height: auto;
    }
    ```

现在,你的 Github Pages 不再默认引用 Main.css 样式,可以自由地使用自己的 CSS 样式表。