03 Noname

Souce code

HEAD

/*--------------- 初期値 ---------------*/
*{ margin: 0; padding: 0; box-sizing: border-box;}
body{
color: #333;
font-size: 12px;
font-family: 'Ubuntu', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, sans-serif;
line-height: 2em;
letter-spacing: 1.9px;
word-break:break-all;
-webkit-tap-highlight-color:rgba(0,0,0,0);
}
img{ max-width: 100%;}
a{
text-decoration: none;
color: #12355b;
}
a:hover{
color: #fcaf58;
}

/*--------------- レイアウト ---------------*/
#wrap{
width: 400px;
max-width: 85%;
margin: 30px auto 0;
}
section{
margin: 50px 0 0;
}
footer{
text-align: center;
margin: 1em;
}
/* テキスト部分 */
.text_title{
display: inline-block;
font-weight: normal;
}
.more{
text-align: right;
margin: 5px 0 0;
}
.more_link{
display: inline-block;
color: #fff;
background-color: #12355b;
padding: 2px 1em;
}
.more_link:hover{
background-color: #fcaf58;
}

/*--------------- メニュー ---------------*/
nav{
text-align: center;
margin: 2em 0 0;
}
nav a{
display: inline-block;
margin: 0 5px;
}

/*--------------- 見出し、文字 ---------------*/
h1{
color: #12355b;
}
h3:after{
content: " ";
display: block;
width: 30px;
height: 5px;
background: linear-gradient(90deg, #12355b 50%, #fcaf58 50%);
margin: 1em 0;
}

/*--------------- 装飾 ---------------*/
hr{
border: none;
height: 1px;
border-top: 1px solid #333;
}
</style>

BODY - 全体レイアウト
BODY - ノート画面レイアウト - ノート部分
BODY - ノート画面レイアウト - 下部表示テキスト
「続きを読む」のテキスト