ブラウザの拡張機能である“Stylus”(Chrome 版 / Firefox 版)を使って、ウェブサイトの見た目を変えることができます。この記事では、そのサンプルを紹介します。 Stylus 自体の使い方の解説は、こちらをご参照ください。 〈目次〉 Wikipedia 左サイドバーの「メインメニュー」を非表示にする Gmail 添付された画像の最大横幅を制限する Yahoo! ニュース コメント欄を非表示にする Cosense 相互リンクの末尾の矢印アイコンを非表示にする Cosenseのページに掲載した画像をマウスでクリックして大きく表示したとき、画像の縦の長さを制限する ページタイトルの直下に横線をひく WorkFlowy カーソルのある行に背景色をつける 関連記事 Wikipedia 左サイドバーの「メインメニュー」を非表示にする div.vector-main-menu-cont
Logseqは、CSS を変更することで外見を変えられます。 この記事では CSS の変更例を紹介します。 〈目次〉 CSS を変更する方法 Logseq の HTML 構造の調べ方 ブラウザを使う方法 デスクトップアプリを使う方法 CSS の変更例 左側のサイドバーの横幅を変更する 画像の横幅を制限する 画像の縦の長さを制限する 〈下位項目が閉じているときの上位項目〉の行頭バレットを分かりやすくする 選択されたブロック(行)の背景色を変える 文字色を変える 引用文の文字色を変える 外部リンクの下線(border)を消し、アンダーラインに変更する ハッシュタグのフォントサイズを変える CSS を変更する方法 変更の仕方は 2 通りあります。 Logseq の右上の…をクリックして「設定」→「一般」→「custom.css を編集」をクリックして開く custom.css を編集する。 Lo
Dynalistのモバイル版のみに適用されるCSSのサンプルを紹介します。 〈目次〉 必要なもの 適用される環境 CSSを適用する手順 CSSのサンプル フォントサイズを変更する 必要なもの Dynalistの有料版(PRO)にアップグレードする必要があります。 なお、既存ユーザーの紹介リンク経由でDynalistのアカウントを作ると、初月のみは有料版が無料になるそうです(当ブログ筆者の紹介リンクはこちら)。 適用される環境 この記事で紹介しているCSSが適用されるのは、下記の3つの環境でDynalistを表示した場合です。 モバイルアプリ(iOS版 / Android版) モバイルブラウザ デスクトップのウェブブラウザでウィンドウの横幅を500px以下ぐらいまで狭めた状態 CSSを適用する手順 Dynalistの有料版(PRO)にアップグレードした後で、Dynalistの画面の右上のメニ
ブラウザの拡張機能(アドオン)である“Stylus”(Chrome版 / Firefox版)を使って、ウェブサイトの外観を変えることができます。 この記事では、その使用例として、Dynalistのメニューの中にある任意の機能を非表示にするCSSを紹介します。 Stylus自体の使い方の解説は、下記の記事をご覧ください。 〈目次〉 概要 非表示にしたサンプル 各メニューを非表示にするためのCSS Collapse Collapse All Expand Expand all Expand to level Level 1 Level 2 Level 3 Level 4 Collapse all siblings Expand all siblings Zoom in Add note Delete Delete checked items Add to bookmarks Sort Titl
Scrapboxをダークテーマで表示する(背景色を暗い色にして、文字色を明るい色にする)ためのCSSを紹介します。 〈目次〉 スクリーンショット 事前の準備 CSSを適用する手順 CSS 参考ページ 関連記事 ブラウザのアドオンを使う方法 スクリーンショット 各ページ 背景色は#24292F、文字色は#d7d7d7です。*1 内部リンクは青色、コンテンツが作成されていない内部リンクはオレンジです。 入力中のキャレット(入力位置を示す縦線)は白です。 テロメア(更新された行を示す行頭の色)のうち、最近更新されたものは水色で表示します。最近に更新されていないものは無色(背景色と同じ)にしてあります。 文字変換中の文字色と背景色 Firefox系ブラウザの場合のみ、変換中の文字色と背景色が、このように黒とオレンジ色の組み合わせとなります。 Chrome系ブラウザなら、変換中の文字色・背景色も、通
ブラウザの拡張機能であるStylus(Chrome版 / Firefox版)を使って、Dynalistの背景色を変えるためのCSSの書き方を紹介します。 ヘッダー(ページの最上部)やサイドバーを含めて、通常見えているエリアの全ての色が変わります。*1 Stylusの使い方については、こちらの記事をご参照ください。 なお、Dynalistの有料版を利用している場合は、本記事で紹介しているCSSを、DynalistのカスタムCSSの入力欄にそのまま入力するだけでもよいだろうと思います。その場合はStylusは不要です。 〈目次〉 スクリーンショット CSS 背景色・文字色・アイコンの色 その他の細かい部分 CSSの適用先の指定 文字が見えにくい部分がある場合の対処法 (備考)Userstyles.orgからのCSSのインストール スクリーンショット 下記に示すCSSを全て適用すると、このような
Firefoxの外観を変更することができるuserChrome.cssの適用例を紹介します(Firefoxのバージョン69または70以降では有効にならない場合があるかもしれません)。 userChrome.cssの作り方については、こちらの記事をご参照ください。 〈目次〉 サイドバーの最上部にあるヘッダーを非表示にする サイドバーとブラウザの間の仕切り線を非表示にする サイドバーとブラウザの間の仕切り線の太さを変える サイドバーの横幅の上限をなくす ツールバーのブックマークメニューから余分な項目を消す サイドバーの最上部にあるヘッダーを非表示にする サイドバーの最上部にあるタイトルのような部分を非表示にします。 適用前 適用後 CSS(ソース) #sidebar-header { display: none; } サイドバーとブラウザの間の仕切り線を非表示にする サイドバーとブラウザの間を
Linuxのデスクトップ環境がCinnamonのとき、パネル(Windowsの場合のタスクバーに相当するもの)に表示されている文字のフォントを変える方法を紹介します。 (赤線部分のように、パネルに直接載っている文字のフォントを変えます) ただし、パネルに設置したアプレットのメニュー画面(例)のフォントは、この方法では変更できません。変更できるのは、パネルに直接載っている文字だけです。 設定の手順 システム設定の中にある「テーマ」を開き、 その画面の一番下の「デスクトップ」の項目に表示されているものが、その時点でパネルに適用されているテーマなので、その名前をメモしておきます(下記の画像の場合なら"Adapta-Nokto-Eta"がテーマの名前)。 ~/.themes/(テーマの名前)/cinnamon/cinnamon.cssというファイルをテキストエディタで開きます。上掲の例なら~/.t
ブラウザの拡張機能である“Stylus”(Chrome 版 / Firefox 版)を使って、ウェブサイトの見た目を変えることができます。この記事では、そのサンプルを紹介します。 Stylus 自体の使い方の解説は、こちらをご参照ください。 〈目次〉 Dynalist チェック済み項目に付く取り消し線を表示しない チェック済み項目の先頭にチェックマーク(✓)を表示する 行頭のバレットを消す 横幅を調整する 画像の最大横幅を指定する 画像の最大縦幅を指定する インラインコードの文字色を変える Roam Research Twitter(ツイート)の展開を避ける 半角スペースがある位置で改行されるのを防ぐ 本文中に貼り付けた画像の横幅や縦の長さの最大値を指定する はてなブログ 編集画面の「お題」を非表示にする TweetDeck カラムの横幅を変える 引用されたツイートの本文の色を変える コト
ウェブブラウザ(Chrome系ブラウザ / Firefox)の拡張機能である“Stylus”の使い方の基本的なところを解説します。 〈目次〉 インストール Chrome系ブラウザへのインストール Firefoxへのインストール 「インストール済みのスタイル」を管理する画面を開く 新しくスタイルシートを作成する 適用先を指定する 作成済みのスタイルシートを編集する 作成済みのスタイルシートを削除する 適用のオン/オフを切り替える ツールバーから切り替える方法 「インストール済みのスタイル」の画面から切り替える方法 適用例 インストール Chrome系ブラウザへのインストール ChromeウェブストアのStylusのページを開き、「Chromeに追加」のボタンを押してインストール。 Firefoxへのインストール Stylusのページを開き、「Firefoxへ追加」のボタンを押してインストール
ウェブブラウザの拡張機能(アドオン)である“Stylus”(Chrome版 / Firefox版)を使って、ウェブサイトの見た目を変えることができます。この記事では、そのサンプルを紹介します。 Stylus自体の使い方の解説は、下記の記事をご覧ください。 〈目次〉 Twitter PCブラウザ版で左側のサイドバーをスクロールするためのスクロールバーを消す タイムラインに表示されているツイートのフォントサイズを変える Web版のTwitterで「# 話題を検索」・「トレンド」・「おすすめユーザー」・「フッター」を非表示にする 「トレンド」欄内の広告を消す(旧UI) 左下のアカウント表示を消す 「○○さんがフォローしています」をPCのブラウザにおいて非表示にする サイドバー内の“Twitter Blue”を非表示にする DuckDuckGoの検索結果の横幅を変える Evernote Web E
〈目次〉 設定のしかた 備考 スタイルシートの例 ダークテーマ 各ページの下に表示される関連ページの大きさを変える トップページに表示される各ページを1行ずつに細く表示する 各ページの下に表示される「関連ページ」を各1行ずつに細く表示する トップページで、ページ一覧が表示される領域の横幅の最大値を変える 各ページのタイトルと本文が入る領域の横幅の最大値を変える 各ページの下の「関連ページ」一覧が表示される領域の横幅の最大値を変える 各ページのタイトル・本文・関連ページが表示される領域の横幅の最大値を変える 引用部分の文字をイタリックにしない コード記法のフォントサイズを変える 本文中の画像に枠線を付ける 本文中のリストのマーカーの色を変える 入力中の文字色と背景色を変える 設定のしかた Scrapboxに独自のスタイルシートを適用する手順はこちらに説明されています。 備考 下記の各スタイル
機能 PCのブラウザ(FirefoxアドオンまたはChrome拡張機能が使えるブラウザ)でTwitterのタイムラインを閲覧している場合にのみ、「○○さんがフォローしています」という但し書き付きのツイートをタイムラインに表示させないようにすることができます。 設定の手順 “うみの さち”さんのブログ「ツイッター:「○○さんがいいねしました」を非表示にする」で紹介されている方法を応用します。このリンク先で説明されている「導入手順」を実行すると、ブラウザにStylusというアドオン(拡張機能)がインストールされます(2020年5月22日現在、リンク先では「更新を停止します」と書かれていますが、使用することはできると思います)。 Stylusの設定画面を開きます。Firefoxの場合は、「アドオン」を一覧する画面を開き、Stylusのアイコンの右側にある「設定」をクリック。Chrome系ブラウザ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く