こちらの下に表示される「トレンド」の内容に不快感を覚える人向け。
.components-home-assets-__sign-recom-test_---recommend---1CKbTa {
display: none !important ; /* トレンドを非表示 */
}
.components-home-assets-__home_---qr-code---iYG7z9 {
display: none !important ; /* QRコードを非表示 */
}
こちらの記事を参考にして下さい。
CSS=Cascading Style Sheetsの略。
特定のウェブサイトを見やすくカスタムしたい人向け。
2023/12/16 Android版Firefoxを追加
使ってるブラウザに合わせて選んでください。
Chrome以外のブラウザでもChromiumベースのブラウザだとChromeの拡張機能を使えるものもあります(バージョン83以降のMicfosoft Edge、Vivaldiなど)
※過去に似たような機能を持つ「Stylish」があり有名だったため古いサイトだと紹介している所が多いですが、閲覧履歴を収集していた事が発覚した危険性の高い拡張機能なのでもしインストールしている人がいたら削除するのをお勧めします。
拡張機能Stylusをインストールする。
ユーザーCSSを使いたいサイトを開いておく。
ブラウザのアドレスバーの右側にある「Stylus」アイコンをクリック。「次のスタイルを書く」にチェックを入れ、その下にあるURLをクリック。
「Usercssとして」にチェックを入れ「アクション>新スタイルを作成」をクリック。
使いたいユーザーCSSのコードをコピーして「 /* ここにコードを挿入... */」の部分にペーストする。
タイトル(左上にある細長い長方形の欄)に自分が分かりやすいタイトルを入力。
タイトル下の「有効」にチェックが入ってるのを確認。
「保存」ボタンクリックで設定終了。
※もしCSSを使いたくなくなったら該当サイトを開きStylusアイコンをクリックし、上の方にある使用中のユーザーCSSの項目のチェックを外してください。
※別な端末でも同じユーザーCSSを使いたい場合は「Stylusアイコンをクリック>管理>バックアップ>エクスポート」でStylusの設定ファイルを保存し、別な端末で「Stylusアイコンをクリック>管理>バックアップ>インポート」から読み込んでください。
(Stylusの設定ファイルは定期的にバックアップしておくのをお勧めします)
拡張機能Stylusをインストールする。
ユーザーCSSを使いたいサイトを開いておく。
アドレスバーの右にある拡張機能アイコン(パズルのピースのようなアイコン)をクリックし、Stylusをクリック。「次のスタイルを書く」にチェックを入れ、その下にあるURLをクリック。
あとはChromeの「『Usercssとして』にチェックを入れ~」以降と同じ。
FirefoxかKiwi BrowserでChrome用のStylus拡張機能(アドオン)を入れて使いましょう。
詳しくは拡張機能が使えるブラウザまとめ(OS別)記事をどうぞ。
拡張機能の使い方は基本的にWindows版と同じです。
現在ユーザースタイルシートを使う手段は無いようです。
・フォントの色を変更したい場合はこちらのサイトで変えたい色のカラーコードを調べて「color:」の右にあるコードを書き換えてください
・WEB色見本 原色大辞典 - HTMLカラーコード
・フォントの太さを太くしたい場合は「font-weight:」の右にある「normal」を「bold」に書き換えてください。
・もっと他の部分をカスタムしたい人はCSSのリファレンスサイトを調べて参考にしてみてください。そんなに難しくないです。
こちらの掲示板のレスの文字の装飾(巨大化、太文字化、原色化)が読みづらいと感じている人向け。
.resbody p , .resheader p {
line-height: 1.2em; /* フォントと上下の余白の高さ */
color: #000 !important; /* フォントの色 */
font-size: 16px !important; /* フォントサイズ */
font-weight: normal !important; /* フォントの太さ */
}
.resbody p , .resheader p {
line-height: 1.2em; /* フォントと上下の余白の高さ */
color: #ccc !important; /* フォントの色 */
font-size: 16px !important; /* フォントサイズ */
font-weight: normal !important; /* フォントの太さ */
}
右端に表示されるフロートボタンを消す。
#fixbtn {
display:none !important;
}
こちらの記事を参考にして下さい。
2023/09/18 サイトのアップデートの影響により上手く動いてなかったため修正
こちらのサイトの文字の装飾(巨大化、太文字化、原色化)が読みづらいと感じている人向け。
p.tweet , p.tweet > span , p.css-5obanl > span, p.css-mdguyd > span , p.css-15agrzi > span, p.css-1tobdhd > span {
line-height: 1.2em; /* フォントと上下の余白の高さ */
font-size: 14px !important; /* フォントサイズ */
font-weight: normal !important; /* フォントの太さ */
color: #000 !important; /* フォントの色 */
}
左下と右下にあるSNS等への投稿フロートボタンを消す
.fixed_social_footer {
display: none ;
}
こちらの記事を参考にして下さい。
* ::-webkit-scrollbar {
width: 15px !important; /* スクロールバーの幅 */
}
* ::-webkit-scrollbar-thumb {
background: #aaa !important; /* スクロールバーのスライダーの色 */
}
* ::-webkit-scrollbar-track {
background: #ddd !important; /* スクロールバーの背景色 */
}
こちらの記事を参考にして下さい。
※下の画像のようにコードのURLの指定を外すと全サイトに適応できます。
カテゴリー
最新記事