TOP

更新履歴枠の角を柔らかい丸みを加える

シリウスのデフォルトで表現される更新履歴のレイアウトは直線的ですね..
それはそれでよいのですが、ブログサービスなど見かける和やかな雰囲気と比較すれば...
やや?感じを受けることもある....個々の判断で...違いもあります。

 

通常は直線的なイメージで良いと思われますが、何かしらのコンテンツ事情でサイト全体に
やさしさを演出する際は、枠に丸みをつけることで変化を表せます...

 

 

デフォオルトTP対応

 

一つの付随手法としてご参照ください...

 

スタイル変更例フォト..

 

カスタマイズにはスタイルシート改行となりますが、全然面倒無く作業は完了しますので
お試しください..

 

以下の記述コードをスタイルシート内に張り付けるだけです
border-radius:7px

 

スタイルシートを開いて以下の記載の箇所に到達してください

 

赤コードが追加した箇所です

 

#whatsnew {
border: 1px solid #0AFFFF;
background-image: url(img/whats_top.jpg);
background-repeat: no-repeat;
background-position: left top;
padding-top: 45px;
padding-bottom: 10px;
padding-right: 10px;
padding-left: 10px;
border-radius:7pxここに追加してます
}
#whatsnew li {
line-height: 25px;
list-style-image: url(img/whats_li.jpg);
margin-right: 10px;
margin-left: 10px;

 

}

 

ここまで...

 

 

丸み度合いは 7pxの数値を変えてご確認下さい
border-radius:7px

 

以下記述のカラーコードを変更すれば枠線のカラーを変えられます
border: 1px solid #0AFFFF;

 

 

説明は終わり...ます...

 

 

スポンサーリンク

 

 

 

更新履歴枠の角を丸くする
シリウスでホットなクールテンプレートカスタマイズ
シリウスカスタマイズトップ

更新履歴枠の角を丸くする関連解説
一カラムでも特定ページを2カラムスタイルに変更する方法
シリウスの1カラムを試用していても、時折2カラムのページも必要かな?何て思いの方は簡単CSS追加でそのページだけ2カラムスタイルみたいに変更できます
フォントスタイルを変える手順と各種フォント記述まとめ
シリウスのフォントスタイルは3つに限定されておりますが、事情により以外のフォントを使用したい場合は、変更説明を含めておりますのでご確認ください
ヘッダー&グローバルナビ、スクロールの固定化組み合わせまとめ
シリウスのヘッダーとグローバルナビをサイトのスクロールに追従せずのカスタマイズ方法は、組み合わせにより複数指定が可能です
グローバルメニューを最上部に配置するおちゃめな方法
シリウスサイトヘッダーの下部にあるグローバルメニューをサイト最上部に配置して見ると また印象が変わります でも 今回はおやめな方法で進めます
グローバルメニュー角丸テンプレート画像採用でカスタマイズ
今回はシリウス角丸テンプレートのグローバルメニュー画像ををデフォルトテンプレートに移動して表示させる方法の解説です
グローバルメニューデザインカスタマイズ
グローバルメニューのデザインをカスタマイズする手段として、画像をでの変更、CSSで構築する方法の二つをご案内します
サイトの背景カラー全体を同色にする ビジネステンプレート
シリウスのホットなカスタマイズ 今回はビジネステンプレートを使用して背景色全体をを切り替えて 海外サイトみたいな構築に進んでみます
ビジネステンプレ―ト 簡単カスタマイズその1
シリウスビジネステンプレ―トの簡単なカスタマイズその1 ホワイトボディにピンク系でのカスタム その1です
記事背景を透明化するカラーコード?
シリウスビジネステンプレートでの記事背景は サイト背景と同色にすることが出来ますが 記事背景をオールフォト画像にした場合は カラーコード設定で記事背景部分を透明化します
メニュー背景を透過する ビジネステンプレート対象ご案内
シリウスサイト背景の構成によりメニューの背景を透過する必要がある場合のカスタマイズをご案内します 今回はビジネステンプレートを対象としています
ヘッダーが消えた?いや透明ヘッダー画像カスタマイズです
シリウスサイト背景をすべて画像にした場合にヘッダー画像を消してみます 削除ではなく透明にカスタマイズすると上級テンプレートにレベルアップ出来ますね!詳細はサイトでご覧ください ヘッダー画像スタイルも透明化すればタイトル背景が画像となり
オールフォト画像サイトの構築を別な角度から見てみます
シリウスで作成したオールフォト画像サイトの構築を別なかくどから見てみますとまたMTML上級テンプレートデザインにちかずくカスタマイズができるかもしれません