ちょっと休憩

information

サイトの説明などを書いたらどうでしょうか。ここはほにゃららほにゃららサイトです。色々あります。付箋はこんなかんじでお好きに色を変えてください動作確認はIEとsafari(iphone5)です、ガラケーではどうなってるのかわかりません

上のメニューだけ表示させた方がシンプルでいいかもしれません。ページはノート風。画像はパブリックドメインの写真を加工したものなので↓から保存して下さい。ナノの背景画像で固定なし、左上表示にしています。

HEAD

body {
 font-size: 13px;
 font-family:'Lucida Grande',
 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3',
  Meiryo, メイリオ, sans-serif;
}

.all {
 text-align: left;
 padding: 3% 10px 0px 40px;  
 line-height: 1.5em;
}

.header{
  font-size: 11px;
 text-align: left;
 margin: 85px 0px 10px 15px;  
 line-height: 1.5em;
}

.u p  {
 border-bottom: 1px dotted #aaaaaa;
 line-height: 2em;
 display: inline;
 padding-bottom: 2px;
}

a {
 text-decoration: none;
}

a:hover { 
  color: #56A8BC; 
  border-bottom: 1px dotted;
}

img { 
 max-width: 100%; 
 height:auto;
}

h1{
 color:#2E2D2D;
 font-size:20px;
 margin: 0px 0px 1px -4px;  
 font-family: 'La Belle Aurore', cursive;
}

h2{
 color:#2E2D2D;
 font-size:15px;
 margin: 0px 0px 0px 0px;  
 font-family: 'La Belle Aurore', cursive;
}

.ma {
background-color: #F2EED0;
color: #56A8BC;
}

@media screen and (min-width: 600px) {.all {  width:600px;}}

@media screen and (max-width: 600px) {.all { 
 width:auto;
 letter-spacing: -0.001em;
 padding: 20% 10px 0px 13px;
 text-align: justify;
 text-justify: inter-ideograph;
}}

</style>

BODY

素材↓

Chotto dake

information