るうのたわごと。

[£]Stinger2をカスタマイズする -「続きを見る」のスタイルを変更する-

 

カスタマイズで検索に来て下さる方もちらほら居てくださるのが励みになっているるう(@Lugh_)です。
さて、ご無沙汰していたStinger2をカスタマイズしてみることにしてみます。
今回は、「続きを見る」のスタイルを変えたいと思います。

続きを見る

今日の作業も、style.cssです。
※作業前と書いているのはDLしてきたままの状態のCSSのことです。

修正の際のキーワードは「motto」と「more-link」。

まずは「more-link」から。

440行目あたり
フォントサイズと文字色、テキストに下線を付けるという指示がされています。

.more-link {
  font-size: 14px;
  color: #5484C8;
  text-decoration: underline;
}

文字色とテキストの下線をなくす設定にします。

.more-link {
  font-size: 14px;
  color: #653d29;
  text-decoration: none;
}

1176行目あたりから。
マウスオーバー前の状態のスタイルです。

 .motto a {
	color: #FFF;
	text-decoration: none;
	background-color: #f3f3f3;
	width: 90px;
	color: #666666;
	text-align: center;
	display: block;
	padding-top: 2px;
	padding-right: 5px;
	padding-bottom: 2px;
	padding-left: 5px;
	font-weight: normal;
}

文字色、枠背景色・枠線の色、形状、太さを変更。

 .motto a {

	text-decoration: none;
	background-color: #b0e0e6; /*枠内背景色*/
	width: 90px;
	color: #653d29; /*文字色*/
	text-align: center;
	display: block;
	padding-top: 2px;
	padding-right: 5px;
	padding-bottom: 2px;
	padding-left: 5px;
	font-weight: normal;
	border-style: dotted; /*枠線種*/
	border-width: 2px; /*枠線太さ*/
	border-color: #4169e1; /*枠線色*/
}

1190行目あたりから。
マウスオーバー時の状態のスタイルです。

 .motto a:hover {
	color: #FFF;
	text-decoration: none;
	background-color: #FFAAAA;
	color: #FFF;
	text-align: center;
	display: block;
}

枠背景色を変更。

 .motto a:hover {
	color: #FFF;
	text-decoration: none;
	background-color: #1e90ff;
	text-align: center;
	display: block;
}

完成図。
続きを読む変更後。

さて、Stinger3も気になるし、モバイル版も何とかしなきゃな…と思っているるう(@Lugh_)でした。

 - ぶろぐ , ,

admax300-2

admax300-2

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA


  関連記事

だららんペンギン
[£]WordPress、上書きインストールからの生還劇(ロリポップ!)

仕事柄「バックアップはしっかり取ってください」とよく言っているるう(@Lugh_ …

feedly-follow-logo-green_2x
[£]Feedlyの配信がうまくできてなかった件

SelfBANが多いなと感じているるう(@Lugh_)です。 最近、ここのFee …

ロリポップユーザー画面1
[£]WordPressのログイン画面にエラー発生した時の対処方法(ロリポップ)

地道なPHPソース書き込みの毎日を過ごしているるう(@Lugh_)です。 昨夜は …

no image
[£]STINGER3、ウィジェットがうまく編集されない場合はテーマを変えてみるといいかも?

と、言うことを書こうと思ったら事象が再現しなかったるう(@Lugh_)です。 い …

title_stb
[£]メモに残した方がいいんだろうなぁ…と思いながら、改造中

久々にPCで書いているるう(@Lugh_)です。 作業はやっぱりiPadじゃ難し …

no image
[£]ウェブマスターツールがエラー(hentry)まみれだったので修正してみた

TLが騒がしかったので、確認してみたら見事にエラーまみれだったるう(@Lugh_ …

no image
[£]Feedlyボタンをつけてみた

るう(@Lugh_)です。 最近使い出したFeedly用のボタンを設置してみるこ …

no image
[£]Stinger2をカスタマイズする -サーチボックスのスタイルを変更する-

今日は何を書こうと思っていたのかをすっかり失念しているるう(@Lugh_)です。 …

no image
[£]Stinger2をカスタマイズする -サイドバー見出しのスタイルを変更する-

年長さんの姪っ子と全力で遊んでちょっと腰に来ているるう(@Lugh_)です。 … …

image
[£]BackWPupがDropboxに保存できなくなっている時の対処法

WordpressのバックアップをBackWPupを使ってDropboxに保存し …