O茶の水元女子大生のHatena日記

2008-06-07

最近やったこと

PHPの前にHTMLCSSが出来ないとサイトは作れない?!」Σ(・ω・ノ)ノ

そんなでちょびちょびお勉強中。べんきょ!べんきょ!

   ∩
( ゚∀゚)彡
  ⊂彡

バイトの仕事に必要なことを勉強してて、HTMLで文章を書くときに使うタグの使い方とか、そこでCSSセレクタを呼び出す方法とかが分かったからメモメモ。

....φ(・ω・` )

HTMLで分かったのは、ソース見て構造がどうなってるか分かるのだいじ。あと、自分で書いたときに終わるところ</**>間違わないようにするの超だいじ。

・定義リスト<dl>(Definition List)

<dl></dl>の間に
<dt></dt>(Definition Term)で定義したい用語・文章を、
<dd></dd>(Definition Description)でその説明が出来るらしい。


・<div><span>
囲まれた部分をグループ化するらしい。


・CSSを必要なときに呼び出す方法
適応させたい部分のhtmlタグの中にクラスタ名を放り込んだらいいっぽい。
<div class="**"></div>
みたいなかんじ。
 "**"がクラスタ名、class とか id だとかはそのクラスタの属性を表してる。

htmlタグが少しばかり分かるようになったので、冒頭のAAをはてダで表示出来るようになった。

ふつうに書いたら改行が入って

   ∩

( ゚∀゚)彡 

⊂彡

バラバラ事件になってまうねんw


だからタグ使ってみた。

<dl>
     ∩<br>
( ゚∀゚)彡<br> 
⊂彡<br>
</dl>

<dl>やのに<dt><dl>使わんくていいんかなーとか、
<div><span><p>、どれでくくってもうまくいかんかったんなんでやろーとか
疑問は残るけど、とりあえず表示出来た!

   ∩
( ゚∀゚)彡
  ⊂彡

やっほい!


あと、写真をいいかんじの位置にうpしようとしていくつか技を覚えた。

<dd class="**">
********
<img style="float:none;margin-top:20px;" src="http://**.jpg" 
alt="****" width="180" height="240">                             
********
</dd>
</dl>

margin-top:20px で上マージンを 20px あけることで、本文と写真がいいかんじの位置にくる。それから float:none で文字の回りこみを解除することで、写真の説明が写真の下に表示させることが出来る。あと、 alt= でその写真がブラウザの都合とかで表示出来ない場合に、代わりに表示するテキストを指定出来るってことを知った!

   ∩
( ゚∀゚)彡
  ⊂彡

MIYAMIYA 2008/06/09 19:07 初コメです。

この記事を読んでいたら勉強したての頃の自分を思いだして、何だか新鮮な感じがしてよかったです。
このエントリーの答えなんですけど、THE HAM MEDIAさんがしてくれているので、URLのせておきます。
http://h2ham.seesaa.net/article/99946769.html

覚える事は沢山あると思いますけど頑張って下さい^^

sayakamesayakame 2008/06/10 17:33 MIYAさん>こんにちは、はじめましてー。
まだまだですケドがんばります!ありがとございますー!

スパム対策のためのダミーです。もし見えても何も入力しないでください
ゲスト


画像認証

Connection: close