スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

html③

・改行 <\/br>

<\b>ふとじ<\/b>

ふとじ

<\font color=red>あか<\/font>

あか

<\i>斜体文字<\/i>

斜体文字


<\font size=5>大きな文字<\/font>

大きな文字

<\font size="+3">大きな文字<\/font>

大きな文字

<\ul>
<\li>あいうえお<\/li>
<\li>かきくけこ<\/li>
<\/ul>


  • あいうえお

  • かきくけこ




<\ol>
<\li>さしすせそ<\/li>
<\li>たちつてと<\/li>
<\/ol>


  1. さしすせそ

  2. たちつてと



<\dl>
<\dt>HTML<\/dt>
<\dd>HTMLとは・・・<\/dd>
<\dt>JavaScript<\/dt>
<\dd>JavaScriptとは・・・<\/dd>
<\/dl>


HTML

HTMLとは・・・

JavaScript

JavaScriptとは・・・




・リンク

リンク先へ飛ぶ
<\a href="http://www.yahoo.co.jp/">Yahoo!<\/a>

Yahoo!

別のウインドウで開く
<\a target="_blank" href="http://www.yahoo.co.jp/">Yahoo!<\/a>

Yahoo!


ページのある場所へジャンプ
<\a name="LocalLink">自サイト内のリンク<\/a>
     :
→ <\a href="#LocalLink">自サイト内のリンク<\/a>

他サイトや他フォルダ、他ファイルの特定個所へのリンク

<\a href="http://www.yyy.zzz/aaa.html#Link">ジャンプ<\/a>


画像の表示

<\img src="panda.gif" width=100 height=100 alt="パンダ">

画像をリンクボタンにする
<\a href="xx.htm"><\img src="xx.gif" border=0 height=20 width=20 alt="説明"><\/a>
スポンサーサイト

html②

タグのカスタマイズについて。


タグにそれぞれ属性(プロパティ)をつけてます。


タグ自体のカスタマイズを「インラインでプロパティをつける」といいます。


(例)

<\div style="color:#ffa500; font-size:20pt; font-weight:bold; text-decoration:underline;">


style=""
プロパティをつけるときはこれが入ります。



・color:#ffa500;

色の指定。#のあとに続く6桁の16進数で色を決めます。

(RGB値で決まっていて、左から2桁づつRed(赤)Green(緑)Blue(青)の濃度が決められます。
ちなみに16進数は9以降の数値をアルファベットで示しておりA~Fがちょうど10進数の10~16に当たります。
つまりすべてMAXにすると#FFFFFF このときは黒になり、すべてMINにすると#000000 このときは白になります。)

・ font-size:20pt;

font(字体)のsize(大きさ)を指定しています。ptは大きさの単位なので特に気にしないでもいいかと

・ font-weight:bold;

fontの太さ。boldにすると太くなります。ちょっと勉強不足


・ text-decoration:underline;

テキストの装飾をします。この場合は下線をつけています



(余談)
プログラミング言語やhtml、CSSなどもそうですが、それぞれに細かい決まりはあるものの
全て英語で書かれているので、意味がそのままだったりします。
個人的にはあいまいな表現の多い日本語よりプログラミング言語のほうが理解しやすいです。
国語が小学生の時に致命的にできなくてテスト隠してたのはいい思い出。
なんかテストひどかったときの文章題の挿絵がリアルなクマさんでリアルなクマさん見ると国語ができないの思い出します。
ちなみに英語もできません\(^o^)/

html①

HTML(Hyper Text Markup Language)本日のまとめ。


(※実際の使用時とは違い「\」マークがついてます。これは機能をエスケープさせています)


・タグを並べて使われる。
・<○○>で始まり、<\/○○>で終わる
・単独使用時は<○○/>
・タグは<\TAG><\Tag><\tag>すべて使用可能です




・<\A><\B>おきゃぴ~ん<\/B><\/A>

この場合Bを先に実行、次にAを実行(内側から使う)

・<\!-- エスケープ -->


・基本的な形

<\html>
<\head>
ヘッダ部。バーの上に出るところの記述
<\title>ここに入力したものがバーに表記されます<\/title>
<\/head>

<\body>
 ボディ部。本文ですね
<\/body>
<\/html>




・<\meta>
headの中に入れる。javascriptやCSS、コードの定義付けをする。



・表

<\table>
<\tr> 行
<\td><\/td> 列
<\/tr>
<\/table>

tableで挟み、trで一行作る。(その中でtdを使って列を作れる)

colspan,rowspanなどで行列を整えられる
border="x"からtd,trに入れると使える(<\td colspan="x">など)








・画像の挿入

<\img src="画像の場所、名前を入れる" />

height,widthなどで調整可能(height="200" width="300" など) 

 基本的に相対パスでおk。


・<\p>

<\p><\/p>で挟んだものが一つの段落で表示される。

単に改行する場合は<\br>で良い。


・<\div>

それ自体に意味はないが、<\div><\/div>で囲ったものに機能を付加できる
(<\div align="center">など)

プロフィール

忘却の空

Author:忘却の空
篠崎愛

最新記事
カテゴリ
最新コメント
月別アーカイブ
FC2カウンター
検索フォーム
RSSリンクの表示
リンク
ブロとも申請フォーム

この人とブロともになる

QRコード
QR
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。