最大横幅 (maxWidth)

詳しくはスタイルとレイアウト#モバイル/デスクトップ両対応レイアウトをご覧ください。

最大横幅のデフォルトは400px

タグ方式

<script type="text/kifu">
▲７六歩 △３四歩 ▲７五歩 △８四歩
</script>

JavaScript関数方式

<div id="board-1"></div>
<script>
  KifuForJS.load({
    "kifu": "▲７六歩 △３四歩 ▲７五歩 △８四歩"
  }, "board-1");
</script>

Reactコンポーネント方式

import {KifuLite} from "kifu-for-js";

export const MyComponent = () => {
  return <KifuLite>
▲７六歩 △３四歩 ▲７五歩 △８四歩
  </KifuLite>
}

最大横幅を指定し直す

タグ方式

<script type="text/kifu" data-maxWidth="300">
▲７六歩 △３四歩 ▲７五歩 △８四歩
</script>

JavaScript関数方式

<div id="board-1"></div>
<script>
  KifuForJS.load({
    "kifu": "▲７六歩 △３四歩 ▲７五歩 △８四歩",
    "maxWidth": 300
  }, "board-1");
</script>

Reactコンポーネント方式

import {KifuLite} from "kifu-for-js";

export const MyComponent = () => {
  return <KifuLite maxWidth={300}>
▲７六歩 △３四歩 ▲７五歩 △８四歩
  </KifuLite>
}

最大横幅を制限しない

caution

横長の画面では大きくなりすぎる場合があります。詳しくはスタイルとレイアウト#モバイル/デスクトップ両対応レイアウトをご覧ください。

タグ方式

<script type="text/kifu" data-maxWidth="null">
▲７六歩 △３四歩 ▲７五歩 △８四歩
</script>

JavaScript関数方式

<div id="board-1"></div>
<script>
  KifuForJS.load({
    "kifu": "▲７六歩 △３四歩 ▲７五歩 △８四歩",
    "maxWidth": null
  }, "board-1");
</script>

Reactコンポーネント方式

import {KifuLite} from "kifu-for-js";

export const MyComponent = () => {
  return <KifuLite maxWidth={null}>
▲７六歩 △３四歩 ▲７五歩 △８四歩
  </KifuLite>
}