FANBOX開設のお知らせ詳細はこちら

ココフォリアのカスタムCSS ステータスのみ

注意

本件はサポート致しません。自己責任でお願いします。

カスタムCSSが動かなくなった際、ココフォリアさんに問い合せをしないでください。

Update

ココフォリア 1.23.1に対応しました(たぶん)

お願い

もし配信等で利用される際は、概要欄にURLなど記載頂けると励みになります!

OBSでココフォリアを表示させる時のカスタムCSSについて | U7D05 BAR
https://ydk.vc/obs-ccfolia-css/
Index

デザイン1

URLココフォリアのURL
1000
高さ300
「OBSを介して音声を制御する」にチェック
  1. カスタムCSSに記載した :nth-child(1) の数値を変更することで、表示されるステータスが変わります
  2. ソース追加後、トリミングすると扱いやすくなります
  3. NPCやエネミーのステータスが表示され、順番が変わるとカスタムCSSを書き直す必要性があります
  4. ステータスの項目数が増えると縦に長くなるので注意が必要です
@import url("https://yudukiak.github.io/ccfoliaCSS/CSS/status.css");

.sc-hsOonA:nth-child(1) {
  display: flex;
}
※1 上記のように(1)だと1番目のステータスが表示され、(3)だと3番目のステータスが表示されます
※表記が古い状態ですが、参考だと思って下さい
※2 追加したステータスのサイズ変更をする際、Altキーを押しながら弄るとトリミングできます

横並びにしたいとき

もし横並びにしたい場合は、 以下のCSSを追加します。
※200の倍数で列数が変わります

.sc-fHsOPI {
  max-width: 400px;
}
max-width: 400px; の場合、2列になります(200×2列)
.sc-fHsOPI {
  max-width: 600px;
}
max-width: 600px; の場合、3列になります (200×3列)

ステータスの背景を削除したいとき

もしステータスの背景を削除したい場合は、以下のCSSを追加します。

.sc-iqGgem {
  display: none;
}

デザイン2

準備中……

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

紅坂柚月(あかさかゆづき)です。
フレ石編成的ななにか DiSpeak の作者。

バ美肉VTuberやってます。
お酒ください。

コメント

コメントする

CAPTCHA


Index
閉じる