[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。
[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。
ちょっとした友人用へ。
普段あたしが使っているHTMLまとめメモを公開してみる
(※あくまで個人用で作ったメモなので、期待はしないでくださいね)
=基本編=
【htmlの基本】
<html>
<head>
<title>ページのタイトル(ページの左上に表示されてるもの)</title>
スタイルシートなど。
スクロールバー、リンク色の設定などHPの装飾関係が多いかな。
</head>
<body>
ここからが本文。
画像や文字やいろいろです。
</body>
</html>
<head>から</head>までにテンプレ、タイトルなどを入力。(タイトルは<title>から</title>の間に入力)
↪少しの例を下の応用編におきます
文章入力以外は半角英字で入力していきます
・文字の大きさ変更
<font size="数字">文字</font>
・文字の色変更
<font color="色">文字</font>
・その他
<b>強調したい文字</b>→こんなの
<s>取り消したい文字</s>→こんなの<u>下線をつけたい文字</u>→こんなの
<i>ななめにしたい文字</i>→こんなの
・フォント変更
<font face="フォント名">文字</font>
・位置づけ
<div align="left">文字を左側に</div>
<div align="center">文字を真ん中に</div>
<div align="right">文字を右側に</div>
・文字にコメント
<font title="コメント">マウスを乗せる文字</font>
コメントというのは、マウスを乗せた時にでてくる、
これ(ダイビング!の文字が出ているもの)→
ですね
・リンク
<a href="リンク先アドレス">リンクしたい文字or画像(.jpg等)</a>
(+α)
・画像リンク
<A href="URL・ファイル名"><Img Src="画像名(.jpg等)"></A>
・・・ここまでが基本編です
いちいち入力するのがめんどくさい!!ってありますよね?
そのための応用編を少しだけ用意しました
めんどくさいあなたへ
\・一括指定/
【<head> と </head>の間に入れる】
<style type="text/css">
<!--
body,td { font-size: 文字のサイズ;
font-family:フォント名;
color:文字の色;}
-->
</style>
これで文字サイズ、フォント、文字色を一気にまとめれる!便利!
※しかしそのページすべてがこのスタイルになるということです。注意
・文字の行間指定
<style type="text/css">
<!--
body,td { line-height:数字px;}
-->
</STYLE>
・リンクの下線がなくなる
<style type="text/css">
<!--
a{ text-decoration:none; }
-->
</style>
・リンクの色変化設定
<STYLE TYPE=text/css>
<!--
A{
text-decoration:none;color:マウスを乗せる前の色;
}
A:hover{
text-decoration:underline;color:マウスを乗せた時の色;
}
-->
</STYLE>
マウスを乗せる前を黒、乗せた時は青にしたいときは・・<STYLE TYPE=text/css>
<!--
A{
text-decoration:none;color:#000000;
}
A:hover{
text-decoration:underline;color:#0000FF;
}
-->
</STYLE>
みたいな。色についての詳しくはこちらへ
続きは>>2へ