投稿

ラベル(LINE風カスタムCSS)が付いた投稿を表示しています

[OBS] L◯NE風ツイキャスコメ欄カスタムCSS - 幅細め

イメージ
『 L◯NE風ツイキャスコメ欄カスタムCSS x4(アイコンサイズ変更可)バージョン 』のメモ📝で公開しているL◯NE風のカスタムCSSですが、配信画面の隅にコメント欄を縦に細長く表示させたい時など、設定Part-2の「コメント横の余白」の各幅の値が大きいままの設定で、コメント欄の幅を(300px以下などに)狭くすると、閲覧コメントが左側に押されてコメントが縦長に表示されてしまう事があります。。。 なので、ここにコメント欄の幅を狭く表示したい時用に調節した、コピペで使える「L◯NE風カスタムCSS - 幅細め 」カスタムCSSを置いておきます。 レイアウトは『 L◯NE風ツイキャスコメ欄カスタムCSS x4(アイコンサイズ変更可)バージョン 』とほぼ同じですが、「閲覧コメントの右の空白幅」と「枠主コメントの左の空白幅」の規定値が小さく設定されていて、タイムスタンプは吹き出しの横ではなく下に表示される仕様(非表示も可)になっています。 「 何の為に幅細め😕? 」と疑問に思う場合は、このページのカスタムCSSを使う前に次のL◯NE風カスタムCSSの一つを試してみる事をお勧めします。 📝 シンプル版 : 細かい設定が無くシンプルです。 📝 x4 バージョン : 色や文字サイズが設定で変更出来ます。 📝 『コメ欄』用 : 別サイトで公開しているカスタムCSSですが、吹き出しに囲い枠又は影を追加する事が出来ます。 見た目がLINEの会話画面とは少し異なりますが、コメント欄の幅を狭くしてもコメントが縦長になりにくいバージョンのカスタムCSSです。(「コメント横の余白」設定が既定値の場合) 又、別メモ📝の『 コメントのフェードイン + フェードアウトのCSSアドオン 』でメモした、 コメントのフェードイン&フェードアウトのアニメーション効果 も「 設定 Part-2 」で有効にする事が出来ます。 [ 目次 ] LINE風カスタムCSS - 幅細め サンプル 設定 (Part-1)   ...

[OBS] L◯NE風ツイキャスコメ欄カスタムCSS x4(アイコンサイズ変更可)バージョン

イメージ
ツイキャスのサイトからコピーする「配信ツール向けオーバーレイ」のURL用のLINE風カスタムCSSの「 L◯NEの会話画面風のツイキャスコメ欄カスタムCSS 」を以前メモしましたが、アイコンが既定値の32x32サイズのままの表示になっていたので、その 4倍の大きさの64x64サイズで表示するカスタムCSS を作ってみました。 32x32 (既定設定)   ➡   64x64 ツイキャスのサーバー上ではユーザーのアイコンは64x64のサイズで保存されているのが一般的な様ですが、「配信ツール向けオーバーレイ」で表示するコメント欄のアイコンの大きさは既定値だと32x32の大きさで表示されます。 64x64の表示であればアイコンの画質も落ちる事も無いはずで、コメント欄をなるべく大きく表示したい時に適したカスタムCSSになっているはずです。 加えて、表示される文字のサイズや色などを マウスクリックで変更可能 にしたので、好みのコメント欄にカスタマイズし易くなっています。 ( [追記] アイコンのサイズも変更可能になりました。) カスタムCSSが表示される欄の下にある CSSをクリップボードにコピー をクリックすると、カスタムCSSがクリップボードにコピーされるので、OBSを使っている場合は、表示に使っているブラウザソース ( )のプロパティ内にある「カスタムCSS」にペーストする事でコメント欄のカスタマイズが可能です。 OBSでツイキャスのコメント欄を設定する方法や、下に説明するCSSをOBSに読み込ませる方法については、先に別のメモ「📝 ツイキャスのコメント欄を表示 (サムネ付きで) 」を参照してみてください。 [ 目次 ] LINE風ツイキャスカスタムCSS x4(アイコンサイズ変更可)バージョン 設定 (Part-1)   [ ▼ ...