如何增加四开内容列的宽度

Question

我有一个四开 html 页面，带有侧边栏和目录（即 3 列页面）。我想增加内容列（中心列）的默认宽度，现在固定为 ~950px。我怎么做？

四开.yml

project:
  type: website

website:
  title: "Big Center Section"
  sidebar:
    style: "docked"
    search: false
    contents:
      - section: "Sidebar"
        contents:
          - text: "Item 1"
            url:  ./somewhere.html

format:
  html:
    theme:
      - flatly
      - custom.scss
    css: styles.css
    toc: true

jupyter ipynb 页面

---
title: "Big wide middle section"
jupyter: python3
format:
    html:
        code-fold: true
        code-line-numbers: true
---


Second cell:

# SOME REALLY REALLY REALLY LONG HEADING I WANT 2000px WIDE.....

Answer 1

更新

Quarto 版本 1.3sidebar-width允许使用、body-width、margin-width和选项设置侧边栏的宽度、文档正文、文档边距以及这些元素（装订线）之间的边距gutter-width。

sidebar-width、body-width、 和margin-width应以像素 (px) 为单位指定，并且gutter-width可以以像素或其他单位（例如 em 或 rem）指定。也可以使用 SCSS 变量。有关详细信息，请阅读quarto 文档中的文章网格自定义。

_quarto.yml

project:
    type: website
  
website:
  title: "Big Center Section"
  sidebar:
    style: "docked"
    search: false
    contents:
      - section: "Sidebar"
        contents:
          - index.qmd

format:
  html:
    grid: 
      body-width: 2000px
      sidebar-width: 200px
      margin-width: 200px
    toc: true

旧答案

width我们可以通过设置为 2000px 来增加内容列的宽度#quarto-document-content（还可以更改右侧边栏的边距以将其推到右侧）

_quarto.yml

project:
    type: website
  
website:
  title: "Big Center Section"
  sidebar:
    style: "docked"
    search: false
    contents:
      - section: "Sidebar"
        contents:
          - index.qmd

format:
  html:
    toc: true
    css: styles.css

索引.qmd

---
title: "Big wide middle section"
jupyter: python3
format:
    html:
      code-fold: true
      code-line-numbers: true
---


# SOME REALLY REALLY REALLY LONG HEADING I WANT 2000px WIDE.....

# SOME REALLY REALLY REALLY LONG HEADING I WANT 2000px WIDE.....

# SOME REALLY REALLY REALLY LONG HEADING I WANT 2000px WIDE.....

样式.css

/* css styles */

#quarto-document-content {
  width: 2000px;
}

#quarto-margin-sidebar {
  margin-right: -600px;
  margin-left: 500px;
}

（请注意，我已经缩小了网站页面的屏幕截图）