忍者ブログ
soraによるただの戯言です・・・・・
ブログ内の検索に役立て下さい。 あまり役に立たないと思うけど(((=ω=)))
Google
WWW を検索 かいそらブログ内 を検索
注意:当ブログの記事あるいは内容等による問題、トラブルが起きましても私自身は責任を負いませんし関与いたしません。 あくまでも自己責任ということでお願いします。
×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。


HPをつくってみたい。かれこれ10個目です。

さて、前回は背景の話をしました。

本日は晴天です!

(;´∀`)

気を取り直して

見出し要素です。

といっても簡単です。要は文章を書くときにわかりやすいように大段落を小学生の時にやったと思います。
小生は1ではなく①を使っていました(´・ω・`)

書き方は段落が6個あると感がえて

<h1>○○○</h1>

この○○○の所が見出しの題にになります。
この<>~</>はタグとして以前やりましたね!

もう少し続けます^^;

p要素というものが世の中にあります。
これは見出しが大段落に対し、pは小段落です。

<p>~</p>

といったようにかけます。
ちなみにpの前後は改行、余白となるので連なっている感じでは







といったように表示されます。

さて今日は段落の話ですが、次回はもっと大きい単位となります。
文章から小さい文集みたいなイメージでしょうか。

終わります(__)

拍手[0回]

PR

前回はメタメタについてやりました。
要はステルス機能で表舞台に出てこないやつです(-"-)

ではですね。やっとここからが本番です。

お・も・て舞台に出てくるやつ!

bodyです。ボディ!(`・ω・´)

bodyとは本文です。

といってもわかりませんよね。
なにもないテキストを考えてください。

文字が黒で背景が白。同じフォントでず~っと続きます・・・・。

そんなつまらないページはいやだ!
と思うはずです。たぶん。

そのために記述していきます。

<body   ○○○>

こんなような感じです。

では

backcolorは背景色を決める属性です。ちなみに属性とは幅広い総称です。たぶん(´・ω・`)

コンピュータの色の数は16億くらい表示できます。また、指定することができます。
いこーる、それは数値化されています。どうでもいいですけど16進数で表します。
つまり背景色は何色か指定の色を選択することにより色が変わるのです。

黒にしたかったら=#0000000みたいに黒は数値で表すとこうなります。

でも背景って色じゃなくて画像がいい人もいますよね。
むふふ、むふふな画像を背景にしたいとか。

そんなひとはbackground="○○○.gif"

指定するとその画像が出ます。相対参照ですね。忘れましたね。もう。'`ィ (゚д゚)/

どうように文字の色を変えるにはtext、ハイパーリンク(クリックで飛ぶやつ)の色はlink、
alinkでハイパーリンクを押した後の色を指定、vlinkで一度訪れた色の表示。

さて、レイアウトとして余白を設定しなければなりません。
そうしないと永遠と続きます。すこし嘘つきました^^;

中身はtopmargin、bottommargin、leftmargin、rightmargin。

どうですか?
以上で背景レイアウトのお話は終わりです。





拍手[0回]


前回はHTMLのバージョンの指定をする必要があると説明しました。
が、これはデンプレートみたいなものなので。
なんで取り上げたってことになると思いますけど、知っててもいいんじゃないでしょうか(笑

今日も似たようなものですが、前回よりはカスタマイズして使う人も多いです。たぶん。

それはmetaです。メタ。メタメタ。メタメター!    ^^;

headとbodyについては以前説明しました。headはタイトル等。bodyは本文です。

HTMLのverも指定しました。しかし、これだけでは目に見えないステルス的な動作はしません。
それがmetaです(´・ω・`)

具体的には文字コード、検索エンジンの条件、キーワード、文書の著作、スクリプト言語の指定などなどあります。

まず文字コード。Webを使ってて文字化けを経験したことはありませんか?
実は日本語でもShiftJisとisoと2通り日本では使用されています。
これを指定しなければなりません。

<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">

これでこのページを訪れた人のブラウザはShiftJISで表示されます。
実は上の文は文法に基づいています。

http-equivとは属性です。最初の話でHTMLはデータをどのような形式で表示させるものと説明しました。
つまりサーバとやりとりするためにどのようにするのか指示する必要があります。
その集まりの総称がhttp-equivと考えると思います。たぶん。

総称なので、細部が必要です。そのひとつがContent-Typeです。
Content-Typeとはデータをやり取りするときの拡張子を指定します。つまり、なんのデータの種類なのか?
ワード?テキスト?html?など・・・。

その内容はtext/htmlに書かれています。
では次のcharsetとはなんでしょうか?

ちなみにcharは文字列に使われます。
ひらたくいうと、なんの文字コードを使っていますか?程度です。
結論はShift-JISですけど。

単に文字コードを指定しただけです。

では次。検索ロボットが巡回して登録します。
Googleが町中パシャパシャ写真撮って、どこになにがあるのかと同じです。
それをWeb上でやっているだけです。しかし、時にはプライベートでやりたい人もいると思うので、
設定が必要なのです。

<meta name="robots" content="INDEX,FOLLOW">

これはrobotsにインデックスとリンク先の侵入許可をさしているだけです。
INDEXとは索引みたいなもの。目次みたいなもので、そこから細かくリンクを踏んで登録されていきます。

では次(´・ω・`)

時間がないので、というかめんどくさくなったので、
次。

^^;

JavaScriptなど、スクリプトを埋め込む際にあらかじめどこに情報があるのか指定する必要があります。
それが

<meta http-equiv="content-script-type" content="text/javascript">

http-equivとは属性で、さきほどサーバとやり取りを行う際の必要な情報の総称といいました。
同様に細部を見ていく必要があります。

content-script-typeでスクリプトの種類(JavascriptやCSS)を指定しています。
次のcontentでどこに情報があるのか指定し、そこから読み取ります。

ちなみにjavascriptを指定しないで、cssを指定したい場合には

<meta http-equiv="content-style-type" content="text/css">

となります。

今日はステルス機能metaについてのお話でした。
自分がどうしたいのか?カスタマイズの部分であると思います。

あ、ちなみにスクリプトとはコンパイルを必要としない言語で、簡易言語です。
知らなくてもいいですけど(;´∀`)

終わり

拍手[0回]


前回はおおまかな構造について述べました。
今回からは前回言ったように細かい話になります。細かいことも大切です。

というわけで、HTMLのverをなに使っているのか?という話を深くします。
これには前回ブラウザがHTMLのverをチェックしているためです。指定する必要があります。

DOCTYPEで宣言。指定を行います。

また、宣言には6つタイプがあります。

1.Strict 対応していないものには使えない。あいまいでないです。

2.Transitional   Strictより緩いです。

3.Frameset    フレームを使用する場合に使います。
フレームとは某掲示板の左側の板の間に線が入っています。つまり分割するものです。

ちなみに6つとあるのはそれぞれシステム識別子のある、なしがあるためです。
ただ、普通のブラウザを使用する場合には必要ないと思います。


システム識別子とは検索をかけると
「文書型宣言で、DTDが置かれている場所を表わすURIのこと。」

じゃあ、DTDとは?XMLで書くことができるとのことです。つまりスクリプト?みたいなものでしょうか?
カスタマイズしたい人には必要なのかもしれません。たぶん。うん、たぶん。きっとw


必要ないと思うので、次(;・∀・)

とおもったら、結構使用されているんですね。今知りました。誤ってました(´・ω・`)

 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">


自分のブログで最初に宣言しています。ちなみにソースの表示ででます(笑

解説すると、DOCTYPEで宣言します。何を?htmlを。
Public。公開?身内だけ?、いいえ、フル公開です。ちなみに公開識別子といいます。

W3Cは所有者の識別子です。ちなみにWebの規格を作っている人です(笑

文識別子はDTD HTML 4.01 Transitonal//EN

英語でHTML 4.01 Transitonalが書かれたxmlを読んでいます。
つまり、この文はHTML 4.01で書いています。でも緩いので対応していないHTMLでも読めます。
てきな意味です。適当(;´∀`)


これで今日は終わりなのですが、識別子がいっぱい出てきたので興味ある人はイカもどうぞw

システム識別子、公開識別子、所有者識別子の3つがでてきました。

システム識別子はDTD、どこの情報を読んでいるのかです。
もちろん、この情報(xml)に書かれた内容は書いた人がいるのです。そのため規格化されています。
それが公開識別子です。しかし、公開されても誰が書いたのか書かなければなりません。
本の著者名が必ず書いてあるのと一緒です。そのため所有者識別子(W3C)を乗せなければなりません。


終わりです(´・ω・`)


 

拍手[0回]


前回はブロックレベル要素とインラインレベル要素を説明しました。
大きいくくりがブロックレベル、小さいくくりがインラインレベルということでした。

さて、いよいよ準備ができたのでやっとHTMLの内容に入っていけます!

わくわくですね~。わくわく。わくわ・・・・。

最初はHTMLのバージョンを述べる必要があります。
というのも実はHTMLはHTML4やHTML5などブラウザが対応してるものとそうでないものを識別する必要があるためです。

というわけで、宣言をします。
DOCTYPEで宣言ができます。

私はHTML4を使用します!とすれば、あとは内容すべてがHTML4ということになります。

しかしHTMLのバージョンがわかっても世界共通で使われています。
そこでhtmlという<html>を用いることにより、言語を指定することができます。
ちなみに日本だとjaです(`・ω・´)

さて、ここらはいったん切り離します。

なぜならこれからは内容に入るからです。

まず頭、headです。
ここに書かれる内容は表示されずに、ステルスで動きます(`・ω・´)

実際に表示されるところはbodyです。
よくブラウザ上で表示されるところはここになります。


というわけで終わりです。

なぜここで終わりかというと、これだけ知っていればHTMLをマスターしたのも当然だからです。
あとは細かいところをぐじぐじやって、書き方を覚えるだけです。

木を見て森をみずです!


たぶん。終わり(;・∀・)

拍手[0回]

<< 前のページ HOME 次のページ >>
[1]  [2]  [3]  [4]  [5]  [6]  [7
カレンダー
07 2017/08 09
S M T W T F S
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31
フリーエリア
最新コメント
[04/27 ]
[05/08 ]
[04/04 ]
[03/27 ]
[08/04 ]
カウンター
アクセス解析

Copyight© かいそらの毎自 All Rights Reserved.
Designed by who7s.
忍者ブログ [PR]