Skip to content

Commit

Permalink
2024/10/09 時点の英語版に基づき更新
Browse files Browse the repository at this point in the history
  • Loading branch information
mfuji09 committed Nov 29, 2024
1 parent b0deb31 commit 56959d0
Showing 1 changed file with 11 additions and 8 deletions.
19 changes: 11 additions & 8 deletions files/ja/web/css/text-underline-offset/index.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
---
title: text-underline-offset
slug: Web/CSS/text-underline-offset
l10n:
sourceCommit: b2833ddfd45cae1bb5e050d24637865e9327408d
---

{{CSSRef}}
Expand Down Expand Up @@ -28,6 +30,7 @@ text-underline-offset: 20%;
text-underline-offset: inherit;
text-underline-offset: initial;
text-underline-offset: revert;
text-underline-offset: revert-layer;
text-underline-offset: unset;
```

Expand All @@ -50,31 +53,31 @@ text-underline-offset: unset;

{{csssyntax}}

<h2 id="Examples">例</h2>
## 例

### text-underline-offset のデモ

```html
<p class="oneline">Here's some text with an offset wavy red underline!</p>
```html-nolint live-sample___examples
<p class="one-line">こちらはテキストと、オフセットさせた赤い下線です。</p>
<br />
<p class="twolines">
This text has lines both above and below it. Only the bottom one is offset.
<p class="two-lines">
このテキストには、上線と下線の両方があります。下線のみがオフセットされています。
</p>
```

```css
```css live-sample___examples
p {
text-decoration: underline wavy red;
text-underline-offset: 1em;
}

.twolines {
.two-lines {
text-decoration-color: purple;
text-decoration-line: underline overline;
}
```

{{ EmbedLiveSample('Examples', '', '', '') }}
{{EmbedLiveSample('Examples')}}

## 仕様書

Expand Down

0 comments on commit 56959d0

Please sign in to comment.