IRON CLAW


万年工事中

IRON CLAWは定期更新を目指し      
日々進化を続ける・・・

html

第3回html ~ハイパーリンク~

またせたな
ひでポンです
今回はリンクについてです
リンクそうトライフォースそしてマスターソード片手にガノンドrffff...

申し訳ありませんでした
まじめにします
許してください
何でもしますから

ん?
ん?
ん?

今...何でもしますって言ったよね

はあい前置きはこれぐらいにしておいて 
久しぶりではしゃいでただけです

そもそもリンクいわゆるハイパーリンクはウェブサイトを作成する上で
とても重要で欠かすことのできないものです
まずリンクには<a>タグを使います
また画像にのリンクを貼ることができます

というかいちいち説明面倒なので
いつものことながらこちらにすでに用意したものが
...
用意したものが
... ...
用意したものが!
... ... ...
用意したものがあああ!!!

sample_html_3_code
あるんです
今回は普通に記述、オンマウスで説明、別窓リンクとなっております
別窓はよーく使いますので覚えていると便利です
はい結果ドン
sample_html_3_確認
まあこのようになれば成功だな
ほんで二番目にマウス持ってくと
無
やはりマウスは消えてしまうか...
まあ二番目に持ってくとこんな感じででてきます
またハイパーリンクは装飾もできるそうですわい
みんなのタグ辞書(ハイパーリンクについて説明しているページに飛びます)
では今日はこの辺で

参考動画(ドットインストール)


本誌参考ページ(P101~119)
 
第2回html ~body~←前回 
次回→次いつになるやら...まあある程度簡単なページ作れるぐらいまでは春休み中に 

第2回html ~body~

おはようございます
ひでポンです
今回はbodyタグについて
 え?今日は水曜?
昨日書けなかったから・・・だよ

前回はbodyタグの中に
ページ見出しの<h1>タグと
段落の<p>タグを記述しましたね
今回は箇条書き、重要語句指定、(ルビ)
ではやっていきましょう
まず箇条書きには結構種類があります
まあ基本的な<ul>タグと <ol>タグ
<ul>はlist(箇条書き)の項目の前に点が付きます
恐らく前にカテゴリ欄を<ul> で作っている途中を見かけた方もいるかもしれませんね
あれです途中で挫折して<p>タグに頼ったひでポンです
一方、<ol>タグは項目の前に数字が付きます

次に重要語句指定ですが
表示としてはワープロとかの太字(Ctrl+Bのあれ)みたいになります
あ、ちなみに<strong>タグ

で、かっこのルビですがなぜかっこかって?
ああ、平仮名ばっかで見にくいですね
まあ理由としてはブラウザが対応してないらしい
IE,Safari,Chromeは何とか対応してるみたいですけど
Firefox,Operaは厳しい・・・
他のブラウザはわかんね
まあ作るけど
そうだ!レビューだけして使わないようにすれば!
まあいわゆるコメントアウトよ
javaやらc#やらわ「//」でしますね
ソースの説明文とかで
でもねhtmlは<!--せつめい-->と記述するんです
慣れないかもしれませんが何かかっこいね
サンプルでファイル上げる時はそういうことにするわ 

ではさっそく書いていこう!
今回も予め書いたものを・・・
sample_html_2_code
ルビ疲れた
死ぬ...
結果こんな風になったかな?
sample_html_2_確認

はあ、お疲れ~

参考動画(ドットインストール)


本誌参考ページ(P60~63,66~67)

では次回(・∀・)つ
朝っぱらから疲れたな

第1回html ~コードを書いてみる~←前回

次回→第3回html ~ハイパーリンク~
 

第1回html ~コードを書いてみる~

おはようございます
ひでポンです
本日より書いていきたいと思います
それとですね、ドットインストール様も参考にさせて頂くんですが
自分の教科書替わりということで
「HTML&CSS 逆引き大辞典」境 祐司 も参考にしながら
進めたいと思っています

まずは、htmlのバージョンの話でも・・・
htmlには3.2,4.01,5の代表的なバージョンがあるそうです
まあ、ここでは5を使っていきます

書き方ですが、不等号の記号を使って要素名を挟む形になります
要素名を挟んだ物をタグと言います
定義をするときは開始タグと、終了タグが必要になります
終了タグは/(スラッシュ)が加わります
例えば、見出しを定義する際には<h1>と記述します
終了は</h1>となります
そして、見出しにしたい文を開始タグと終了タグで挟みます
<h1>IRON CLAW</h1>
このように、タグで文書の意味づけしていく作業をマークアップといいます
また、改行を行うときは<br>と記述します
<br>は文書の意味づけとは異なる為開始タグのみ記述します

段落は<p> </p>タグを使います
その他に、<a></a>ハイパーリンク
<img>画像の表示などいろいろなタグがあります
<!DOCTYPE html>htmlだということを宣言
<html lang="ja">日本語指定

では実際に書いていきましょう(DOCTYPE,langは省きます)
sample_html_1_code
ざっと書いてみました
<title>タグはブラウザのタブのところに表示されます
次に保存する際の注意事項です
1.文字コードの指定保存
指定保存
今は「UTF-8」が主流だそうです
変更をお忘れなく
2.拡張子
kaku
拡張子は「.html」です

ではブラウザで表示を確認してみましょう
sample_1_確認
このようになればきちんと記述できています
お疲れさまでした

参考動画(ドットインストール)



本誌参考ページ(P14~17,40~45)
 
購入(Amazon) 


では次回お会いしましょう(・◇・)ゞ

htmlの基本←前回
次回→第2回html ~body~

htmlの基本

おはようございます
ひでポンです
今日から本格的にhtmlをやっていきたいと思います

そもそもhtml(HTML)とは
Hyper Text Markup Languageの略称

htmlをするにあたって
 ・ブラウザ(IE、Google Chromeなど) 
 ・テキストエディタ(メモ帳など)

当サイトではブラウザは Google Chrome
テキストエディタは Tera Padを使用します

リンク貼っておきますね(別窓でリンクが開きます)
Google Chrome download 
Tera Pad download(窓の社)  

次回からやっていきますよ
ではまた(`・д・´)ノ 

次回→第1回html ~コードを書いてみる~


最後に・・・
ドットインストール様を参考にしつつ更新していきたいと思っております
リンク集にもリンク先貼っておきますね 

今回のレッスン(ドットインストール)
 

Favicon

おはようございます
ひでポンです

昨日は高知の方で日本最高気温が更新されたとか
暑い日が続きますね 
では、今回はhtml第1回ということで Faviconについて説明しましょう

Favicon とは
サイトのシンボルマークとしてサイトの運営者がサイトや
ページに配置するアイコン
の俗称である  wikiより
Favorite iconを縮約したものだそうです

ふぁびこん
赤で囲まれた場所がまさしくFavicon です

なぜ今回これを説明したかと申しますとまあ自作してみたよ
ってことで・・・ 

あは
 下手ですねはい
すみません
まあ変えときますんでよろしくおねがいします
ちなみに大きさは16×16です

ではでは(・∀・)つ 
記事検索
ぷろふぃーる
ひでポン
pupu
一応管理人
「サイトを一緒に作らねえか?」



ごとうげ
マリオ
このブログの縁の下の力持ち
「」



QRコード
QRコード
おしらせ

dropbox問題発生中

アクセスカウンタ
  • 今日:
  • 昨日:
  • 累計:

相互リンク

相互リンク(追加順)

┗気まぐれなブログ。

  • ライブドアブログ

Back to Top