Mit `StaticFiles` können Sie statische Dateien aus einem Verzeichnis automatisch bereitstellen.

## `StaticFiles` verwenden { #use-staticfiles }

* Importieren Sie `StaticFiles`.
* „Mounten“ Sie eine `StaticFiles()`-Instanz in einem bestimmten Pfad.

{* ../../docs_src/static_files/tutorial001_py310.py hl[2,6] *}

/// note | Technische Details

Sie könnten auch `from starlette.staticfiles import StaticFiles` verwenden.

```jinja hl_lines="4"
{!../../docs_src/templates/templates/item.html!}
```

В этом примере будет создана ссылка на CSS-файл `static/styles.css` с помощью:

```CSS hl_lines="4"
{!../../docs_src/templates/static/styles.css!}
```

```jinja hl_lines="4"
{!../../docs_src/templates/templates/item.html!}
```

Bu örnekte, şu şekilde `static/styles.css` konumundaki bir CSS dosyasına link verir:

```CSS hl_lines="4"
{!../../docs_src/templates/static/styles.css!}
```

```jinja hl_lines="4"
{!../../docs_src/templates/templates/item.html!}
```

У цьому прикладі це посилатиметься на файл CSS у `static/styles.css` за допомогою:

```CSS hl_lines="4"
{!../../docs_src/templates/static/styles.css!}
```

```jinja hl_lines="4"
{!../../docs_src/templates/templates/item.html!}
```

En este ejemplo, enlazaría a un archivo CSS en `static/styles.css` con:

```CSS hl_lines="4"
{!../../docs_src/templates/static/styles.css!}
```

```jinja hl_lines="4"
{!../../docs_src/templates/templates/item.html!}
```

Dans cet exemple, cela créera un lien vers un fichier CSS `static/styles.css` avec :

```CSS hl_lines="4"
{!../../docs_src/templates/static/styles.css!}
```

from fastapi import FastAPI, Request
from fastapi.responses import HTMLResponse
from fastapi.staticfiles import StaticFiles
from fastapi.templating import Jinja2Templates

app = FastAPI()

app.mount("/static", StaticFiles(directory="static"), name="static")


templates = Jinja2Templates(directory="templates")


@app.get("/items/{id}", response_class=HTMLResponse)
async def read_item(request: Request, id: str):

템플릿 내에서 `url_for()`를 사용할 수 있으며, 예를 들어 `name="static"`으로 마운트한 `StaticFiles`와 함께 사용할 수 있습니다.

```jinja hl_lines="4"
{!../../docs_src/templates/templates/item.html!}
```

이 예제에서는 다음을 통해 `static/styles.css`에 있는 CSS 파일에 링크합니다:

```CSS hl_lines="4"
{!../../docs_src/templates/static/styles.css!}
```

그리고 `StaticFiles`를 사용하고 있으므로, 해당 CSS 파일은 **FastAPI** 애플리케이션에서 `/static/styles.css` URL로 자동 제공됩니다.

## 模板与静态文件 { #templates-and-static-files }

你还可以在模板内部将 `url_for()` 用于静态文件，例如你挂载的 `name="static"` 的 `StaticFiles`。

```jinja hl_lines="4"
{!../../docs_src/templates/templates/item.html!}
```

本例中，它将链接到 `static/styles.css` 中的 CSS 文件：

```CSS hl_lines="4"
{!../../docs_src/templates/static/styles.css!}
```

因为使用了 `StaticFiles`，**FastAPI** 应用会自动提供位于 URL `/static/styles.css` 的 CSS 文件。

## 更多说明 { #more-details }

```jinja hl_lines="4"
{!../../docs_src/templates/templates/item.html!}
```

Neste exemplo, ele seria vinculado a um arquivo CSS em `static/styles.css` com:

```CSS hl_lines="4"
{!../../docs_src/templates/static/styles.css!}
```