【使えなくなりました💧】wikipediaの背景を変える

11253 ワード
Stylish Chrome Chrome テキストリンク

追記

キモの拡張機能が使えなくなったので、この記事の内容はおそらく再現しないです

⏰この記事の内容は約1分で実行できます。

【注意】素人が書いた記事です。なまあたたかいめでみてね

まとめ

  • 任意のwikipediaページの背景に好きな画像が出てくるようになる
  • 猫でもわかる簡単さ
  • chrome限定
  • chromeの拡張機能ありき
  • chromeの拡張機能「stylish」、便利

つまり

  1. chrome開く
  2. 拡張機能「stylish」入れる
  3. 新規スタイルを作る
  4. こぴぺ

でできる

まとめない

stylishを入れる

chromeで下のリンクに飛んで、chromeに追加をぽち
Chrome ウェブストア

ウィンドウの右上（ツールバーの右端）のこれをぽち

点点点をぽち、スタイルを作るをぽち

スタイルを作る

名前つけて、適用先を決めて、コード書く、保存、以上

コードの例

画像のurlにローカルを指定する方法がわからなかったので、
頭悪いなと思いつつどっかから拾ってます（本当に頭悪い）

ここでまとめました
stylishでcssを弄るとき、background-imageをどこから拾うか

あとurlがhttpだと怒られてhttpsだと怒られなかったりするの注意

サイズとか位置は適当に

wikipedia
[class*="mediawiki"]{background-image:url("https://i.imgbox.com/4q9m3xDi");background-size:1700px auto;background-repeat:no-repeat;background-attachment:fixed;background-position:left bottom;}
#mw-page-base{background-image:url("https://i.imgbox.com/4q9m3xDi");background-size:1700px auto;background-repeat:no-repeat;background-attachment:fixed;background-position:left bottom;}
#content{background-color:rgba(255,255,255,0.5);}
#mw-panel{background-color:rgba(255,255,255,0.5);padding-left:0px;margin-left:8px;}
#p-logo{background-color:rgba(255,255,255,0.5);left:0px;}
#mw-head-base{background-color:rgba(255,255,255,0.5);}
#firstHeading{background-color:rgba(255,255,255,0.3);}

少しばかしコメント付けてみる

wikipedia
/* 見出しより上に背景画像をいれる*/
[class*="mediawiki"]{background-image:url("https://i.imgbox.com/4q9m3xDi");background-size:1700px auto;background-repeat:no-repeat;background-attachment:fixed;background-position:left bottom;}
/* 見出しより下に背景画像をいれる */
#mw-page-base{background-image:url("https://i.imgbox.com/4q9m3xDi");background-size:1700px auto;background-repeat:no-repeat;background-attachment:fixed;background-position:left bottom;}
/* メインコンテンツの背景を白くする */
#content{background-color:rgba(255,255,255,0.5);}
/* 左のリンクの背景を白くする＆余白が変だったので弄る */
#mw-panel{background-color:rgba(255,255,255,0.5);padding-left:0px;margin-left:8px;}
/* ロゴの背景を白くする＆余白が変だったので弄る */
#p-logo{background-color:rgba(255,255,255,0.5);left:0px;}
/* 見出しより上の背景を白くする */
#mw-head-base{background-color:rgba(255,255,255,0.5);}
/* 見出しの背景をさらに白くする */
#firstHeading{background-color:rgba(255,255,255,0.3);}

でした

リンク

ヒトリゴト

初めて書いた記事です。読んでくださってありがとうございます

\def\textlarge#1{%
  {\rm\Large #1}
}
\def\textsmall#1{%
  {\rm\scriptsize #1}
}

（精一杯小声で）
　　$\textsmall{い　い　ね　く　だ　さ　い}$

ヒトリゴトだよ（恥ずかしいこと　聞かないでよね　）