HTML練習とCSSの練習

ねんねらをしかる時は、言葉を選ぶようにしています。もちろん、感情的にならずに。

言葉を選ぶと言うのは、本当に難しい。
けれども、ねんねらが、いけないことをした時は、

  • 行った行動を指摘。
  • なぜ・どこがいけないのかを分り易く伝える
  • 相手がいる場合、相手がどんな気持ちになるか、ねんねに考えてもらう。
  • 最後に、ママは今は、あなたの行動をしかったけれども、あなたが大切よ、と伝える。


を心がけています。

人格を否定されるのは、大人でもキツイので・・・。


・・・はい。


また、平気でそういうことを言う人も多いので。
私は、根幹となる安心感がねんねらに育ってほしいなと願います。


授業で習った、cssスタイルシートの練習です。

<!DOCTYPE HTML PUBLIC"-//W3C//DTD HTML 4.01//EN""http:
//www.w3c.org/TR/html 4/strict.dtd">
<html lang=ja>
<head>
<meta equiv="Content-Type" content="text/html; charset=Shift-JIS">
<title>練習</title>
<link href="basic.css" rel="stylesheet" type="text/css">
</head>

<body>
<h1>My Home Page</h1>
<h2>2004/12/3</h2>

<p>ここは練習用のホームページです。ここで<em>スタイル
シート</em>の練習をしていきましょう。この<a 
href="#">HTMLファイル</a>と同じフォルダの中に<a
href="#">CSSファイル</a>がありますので、そこにスタイル
シートを入力していきましょう。</p>

<h2>2004/12/4</h2>
<p><img src="images/image.jpg">2004/12/4CSSファイルを編
集したら、忘れずに上書き保存をしましょう。上書き保存をし
ていないと、入力したデザインが反映されません。</p>

<h2>Link</h2>
<ul>
<li><a href="#">Link1</a></li>
<li><a href="#">Link2</a></li>
<li><a href="#">Link3</a></li>
<li><a href="#">Link4</a></li>
<li><a href="#">Link5</a></li>
<li><a href="#">Link6</a></li>
<li><a href="#">Link7</a></li>
</ul>

</body>
</html>


cssスタイルシート
body{
background-image: url(../images/bg.jpg);
background-repeat: no-repeat;
background-position: center center;
}
h1{
color: orange;
font-size: 1.5em;
font-family: sans-serif;
border-color: gold;
border-style: dotted;
border-width: 5px;
}
h2{
color: yellowgreen;
font-size: 1.2em;
font-family: sans-serif;
}
em{
background-color: yellow;
}
img{
float: left;
}
a: link{
color: lightseagreen;
}
a: visited{
color: deeppink;
}
a: hover{
color: red;
background-color: pink;
}

んで、表示はこうなります。


上がHTMLの記述のみ、下が外部リンクでCSSスタイルシートを加えたものになります。