試運転用

Usage

リンク文字、マーカー風文字のように表示されます。

こちらのテンプレートはサイト名が長くなると読めなくなる場合があります。その場合はフォントサイズなどを調節してご利用ください。

code

HEAD

/*--------------- 設定 --------------- */
*{
margin: 0; padding: 0;
font: normal normal 11px/1.9em 'Baloo Tamma', "メイリオ", sans-serif;
background: transparent;
}
body{
color: #2d3047;
letter-spacing: .1em;
background: #feffff;
box-sizing: border-box;
word-break: break-all;
}
a{ text-decoration: none; color: #ff4540;}
a:hover{ color: #1b998b;}
/*--------------- 構成 --------------- */
.wrap{
width: 380px;
max-width: 80%;
margin: auto;
}
.head{
width: 100%;
height: 90px;
background: #ff4540;
}
.head2{
width: 100%;
height: 45px;
background: #ff4540;
margin: 0 0 20px 0;
}
.box:before{
content: " ";
display: block;
height: 5px;
background: #ff4540;
border-radius: 20px;
margin: 0 0 10px 0;
}
.box:after{
content: " ";
display: block;
height: 5px;
background: #1b998b;
border-radius: 20px;
margin: 10px 0 0 0;
}
/*--------------- メニュー --------------- */
#menu{
text-align: center;
margin: 30px 0 0 0;
}
#menu a{
font-size: 14px;
margin: 0 3px;
padding: 5px;
}
/*--------------- 見出し/文字 --------------- */
h1{
position: relative;
top: 38%;
color: #feffff;
font-family: 'Baloo Tamma', 'Rounded-M+-1p-medium', "メイリオ", sans-serif;
font-size: 50px;
line-height: 80px;
text-align: center;
background: ;
margin: auto;
}
h2{
color: #ff4540;
font-size: 22px;
text-align: right;
margin: 20px 0;
}
h2:after{
content: " ";
display: block;
width: 50px;
height: 5px;
background: #ff4540;
border-radius: 20px;
margin: 0 0 0 auto;
}
h3{
font-size: 16px;
color: #1b998b;
margin: 20px 0 0 0;
}
mark{
font-weight: bold;
background: linear-gradient(rgba(255, 255, 255, 0) 50%, #f5f568 0%);
}
</style>

TOP PAGE

Picopico

Infomation

first

about link

master

Usage

code