css 赤と青 三角

今日:2 hit、昨日:5 hit、合計:768 hit

CSS ▼△

使うならまずこれを読む
【CSS配布】Surface

▶できること
フォントや機能の追加◯
改変◯
画像リンクの取得・配布◯
ソースの中抜き◯
中抜きしたソースで作成したcssの配布◯
改変後の配布◯

▶できないこと
CSSそのままの再配布

【付属画像】
・ハート
・さんかく模様のイラスト↗
・選択ボタン2種
・星

適用中の背景は【CSS配布】Surfaceと同じものにしてますが、ソースをそのままコピペすると背景色が#d44553■になります

そのままでもよし、surfaceとお揃いもよし、#F2F2F2■にしてマリンカラーにするのもおすすめです

/*---------
消すな
CSS配布元:http://uranai.nosv.org/u.php/novel/iamhungry52/
---------*/

/*テーマ色
#4e62ab 青色…メインカラー
#cf2529 赤色…サブカラー
#141022 黒紫色…サブカラー2 メイン文字色
#d44553 オレンジピンク…背景色候補1
#F2F2F2 白灰色…背景色候補2
*/

/*背景をsurfaceと同じにしたい場合
①デザイン設定の項目の下にある「背景画像: (空白可能)」の項目に以下のurlをコピペする
http://cimg.nosv.org/uranai/img/bgimg/dot_26.gif
②背景を半透明化する以下のソースも貼る
div#content,div#container,div#wrapper,div#desc{
background:rgb(255,255,255,47%);}
*/

/*作品説明欄のさんかく画像がいらない場合はここから消す*/
div#desc{
background-image:url(http://img.u.nosv.org/uploader/files/a/b/b/abb1c370d5ded1cfebb21293d64dfba0.png);
background-repeat:no-repeat;
background-size: auto 100%;
background-position:top right;}

@media screen and (max-width:769px){
div#desc{
background-size: auto 75%;
background-position: top left ;}}
/*ここまで消す*/

/*◆ページ全体に影響する機能*/
/*選択範囲色*/
::selection{
color:#4e62ab;
background:#c8c8c85c;}

/*リンク色*/
a:link{color:#4e62ab;}
a:visited{color:#cf2529;}

/*ホバー*/
a:hover {
color:#8a97c7;}

/* おもしろ度の評価文字色 */
.ratingblock,.static,p.voted,span.thanks{
color:#4e62ab !important;}

/*テキスト入力ボックス枠線*/
input[type=text]{
border-radius:0em !important;
border:1px solid #4e62ab;}

/*ブロック間調整*/
div#content form,div#desc{
margin: 2px 0 !important;}

.fnormal{
margin: 2px 0 3px !important;}

/*最背面背景色*//*全体文字色*/
body{background-color:#d44553;
color:#141022;}

/*コンテンツフォーム(一番でっかい枠)の線*/
div#container{
border :solid 4px #4e62ab;
border-left:none !important;
border-right:0 !important;}

/*◆ページ上部*/
/*umedia リンク*/
div#umbar.clearfix {
background-color:#4e62ab !important;
border-color:#4e62ab !important;}

div#umlinks.umclmn a{color:#fff !important;}

/*占ツクのトップバー(下線)*/
#topcon,#topcon_line{
border-bottom-color:#4e62ab !important;}

/*トップメニュー(マイペ探す作る履歴)*/
div#topmenu {
border: solid 1.8px #4e62ab !important;
border-left: none !important;
border-right: 0 !important;}

/*トップメニュー探すテキスト入力欄外枠*/
#seboxform {
border: solid 1px #fff !important;
background-color: #fff !important;}

/*トップメニュー探す項目毎の枠線*/
p.block.spmymenu.clearfix a{
border:1px solid #c3c6cf;}

/*◆作品表紙の見た目*/
/*タイトル下線*//*右メニュー見出し下線*/
div#header,h2{
border-bottom: solid 1.8px #4e62ab !important;}

/*最初の一文字*/
h1:first-letter {color:#4e62ab;
font-size: 1.2em;
font-weight:300 !important;}

/*それ以外の文字*/
h1.utitle a{color:#cf2529 !important ;
font-weight:300 !important;}

/*ヒット数、最終更新日*//*執筆状態*/
.hblock,.nstat,#lastmod{
color:#3e4f8d !important;}

/*右上のハートと、お話選択欄のハート*/
.hrtc,.hrtct{
background-image:url(http://uranai.nosv.org/uploader/common/5/a/5/5a5fd5c75e5f05927ddbe51fed861a97.png)
!important;
color:#3e4f8d !important;}

.hrtc{background-size: 8px 8px !important;}

/*作品説明欄の文字色と枠色*/
div#desc{
background-color:rgb(255,255,255,47%);
color:#141022;
text-shadow: 1px 1px 3px #fff, 1px 1px 3px #fff, 1px 1px 3px #fff, 1px 1px 3px #fff, 1px 1px 3px #fff, -1px -1px 3px #fff, -1px -1px 3px #fff, -1px -1px 3px #fff;
border:3px double #4e62ab;}

/*お話選択の背景色・枠*/
div#content form#dr{
background-color:#fff;
color:#4e62ab;
border:none !important;}

/*お話選択の文字色*/
div#content form#dr a{
color:#4e62ab;}

/*お話選択の文字色ホバー*/
div#content form#dr a:hover{
text-shadow: 0 0 2px #5d70b7;
color:transparent;}

/*最初から読む,選択した内容を見る*//*次話のボタン*/
input[type=submit] ,.p_next span,
div#tobbs{
background-color: #fff !important;
color:#cf2529 !important ;
font-weight:;
border:3px double #cf2529;}

/*次話ボタンの文字*/
.p_next span,.p_next span a{
color:#cf2529 !important;}

/*話選択ボタン*/
/*標準ボタンを非表示*/
input[type=radio]{visibility:hidden;}

@media screen and (max-width: 769px){
div#content form.ipt fieldset label.ulbl {
margin-left: -10px !important;
display: inline-block;}}

/*選択外*/
input[type=radio] + label{
padding-left:22px;
background:
url(http://uranai.nosv.org/uploader/common/4/9/6/4966bab3817438d5fdf794a69a028494.png)
center left / 12px 12px no-repeat;}

/*選択中*/
input[type=radio]:checked + label{background:
url(http://uranai.nosv.org/uploader/common/c/c/b/ccb87e30caa0b4299648676b43593469.png)
center left / 12px 12px no-repeat;}

/*青二重線枠ページタイトル、評価欄コメントフォーム*/
.result h3 ,.ratingblock , .commentform{
background-color:#fff !important;
color:#4e62ab !important;
border-radius:0.4em !important;
border:3px double #4e62ab !important;}

/*ページナンバーの色*/
.pageno,h2#hl_cmt span ,ol.navlist span.fs85{
color:#cf2529 !important;}

/*◆ページ下部*/
/*お気に入り登録*/
div#content .oblock{
border: none;
background-color: #fff;}

/*上記以外の枠線色(関連作品、マイページ、コメントフォームなど)*/
.block{
background-color:#ffffff59 !important;
border-radius:0.2em !important;
border:1px solid #c3c6cf !important;}

/*スマホ関連作品ランキング見出し*/
.fnormal{
background-color:#fff!important;
border: solid 1.8px #4e62ab !important;
border-left: none !important;
border-right: 0 !important;}

/*関連作品小見出し文字色 */
.fnormal a{color:#4e62ab !important;}

/*スマホ関連ランキング,関連作品背景色*/
.block.urank ,.relsolr,.block.clearfix {background-color:#fff;
border-radius:0.4em !important;
border:1px solid #4e62ab !important;}

/*上記2つの枠内線*//*pc版関連作品ランク内点線色*/
span.listitem ,ol.navlist li{
border-bottom: solid 1px #c3c6cf;}

/*◆評価欄星 */
.unit-rating,
.unit-rating li.current-rating,
.unit-rating li a:hover{
background-image:url(http://img.u.nosv.org/uploader/files/2/f/4/2f4ed4680866b6f9ce7bd10b6d38c15e.png);
background-size:30px auto;}

@media only screen and (max-width:600px){
.unit-rating li.current-rating,
.unit-rating li a:hover{
background-size:25px auto !important;}}

/*◆ソーシャルトグル*/
div#socialtoggle.block img{
visibility:hidden;}
div#socialtoggle.block{
background-image:url(http://img.u.nosv.org/uploader/files/d/8/9/d89828447c2af36f2e24fbc4de825d6c.png);
background-repeat:no-repeat;
background-position:center;
background-size:240px auto;}

/*文字の大きさ変更ボタン*/
#resizer{
background-color:#ffffffc2;
padding:4px;
font-size:10px;
letter-spacing:-.1em;
border-radius:0.4em;
border:1px solid #4e62ab;
text-shadow:none;}

ホムペを作る｜感想を書く
 他の作品を探す

おもしろ度を投票
( ← 頑張って！｜面白い！→ )