HTML勉強メモ

HTMLやJavaScriptなどのことについて書いています。

HTML

時刻をリアルタイムで更新させる方法

時刻をリアルタイムで更新させる場合 まとめ 時刻をリアルタイムで更新させる場合 現在の時刻を表示する方法 htmlst.hatenablog.jp曜日も表示させる方法 htmlst.hatenablog.jpコードを追加することで、時刻をリアルタイムで更新させることができる。追加する…

現在の時刻の他に曜日も表示させる方法

曜日も表示させる場合 まとめ 関連記事 htmlst.hatenablog.jp ↑現在の時刻の表示 曜日も表示させる場合 現在の時刻の表示を行う記述の値の取得部分と出力部分に、 下記の記述を加える。値の取得部分 var you = now.getDay(); //曜日 //曜日の配列(日~土) …

onloadの使い方

onloadの使い方について bodyタグ内で「onload」を使用する場合 window.onloadを使う場合 まとめ onloadの使い方について 「onload」を使用することで、ページなどの読み込み時に処理を行うことができる。 onloadにはいくつかの使い方がある。(例) body onlo…

絶対パスと相対パスの違い

絶対パスと相対パスの違いについて 絶対パスとは 相対パスとは まとめ 絶対パスと相対パスの違いについて HTMLで、特定の場所にアクセスする方法は2つあり、 それぞれ絶対パスと相対パスと呼ばれる。 絶対パスとは そのページに直接アクセスするパスを絶対パ…

メモ張にHTMLファイルを保存するときの注意点

メモ張にHTMLファイルを保存するときの注意点 文字化けしないようにする 「〇〇.html」という名前で保存する メモ張にHTMLファイルを保存するときの注意点 文字化けしないようにする メモ帳に保存したときに文字化けしないように、文字コードを変更する。Web…

meta keywordsの書き方

meta keywordsの書き方 書き方について 書く内容などについて meta keywordsの書き方 書き方について meta keywordsは単語を「カンマ(,)」で区切って使う。 ×:<meta name="keywords" content="ブログ HTML CSS"> 〇:<meta name="keywords" content="ブログ,HTML,CSS"> 書く内容などについて ・単語区切りで書く ・ページのコンテンツとマッチしていることを</meta></meta>…

HTML5で追加されたタグ

HTML5で追加されたタグ2つ ・headerタグ ・footerタグ HTML5で追加されたタグ2つ ・headerタグ 文書やセクションのヘッダーを表す。 <header>~</header> ・footerタグ 文書やセクションのフッターを表す。 <footer>~</footer>(使用例) <html> <head> <meta charset="UTF-8"> <title>title</title> </head> <body> <header> ヘッダー部分 </header> <div>コンテンツ部分</div> <footer> フッター</footer></body></html>…

HTMLで文字化けしないようにする方法

HTMLで文字化けしないようにするには 記述を行う場所 文字コードを指定する 文字化けしない記述を書かないとどうなるか まとめ HTMLで文字化けしないようにするには HTMLで文字化けしないようにするためには、 headタグ内で文字コードを指定する記述を行う。…

別タブでリンクを開くようにする方法

別タブでリンクを開くようにするには 別タブでリンクを開くようにするには 別タブでリンクを開くようにする場合、 <a href="" target="_blank"></a>を使用する。(使用例) <a href="Webサイト等のURL/" target="_blank">Webサイト名等</a>このブログの場合、 <a href="http://「設定したURL」.hatenablog.jp" target="_blank">HTML勉強メモ</a>と記述することで、「HTML勉強メモ」のリンクをクリックすると 別タブで…

HTML4とHTML5の違い

HTML5という言葉を聞きますが、 HTML4と比べてどのような違いがあるか調べてみました。 HTML4とHTML5の違い ソースコード内の「DOCTYPE宣言」が異なる 文字コードの指定が異なる 今まで難しかったことが簡単にできる まとめ HTML4とHTML5の違い ソースコード…

JavaScriptで現在の時刻を表示する方法

JavaScriptで現在の時刻を表示する方法 まとめ JavaScriptで現在の時刻を表示する方法 JavaScriptを使うことでページに現在の時刻を表示することができる。 <body> <span id="viewTime"></span> <script type="text/javascript"> document.getElementById("viewTime").innerHTML = getNowTime(); function getNowTime() { var </body>…

HTMLとCSS

HTMLとCSS HTMLとは・・・ 「HyperText Markup Language(ハイパーテキスト マークアップ ラングエージ)」の略。 ページの要素や構造を指定する。 CSSとは・・・ 「Cascading Style Sheets(カスケーディング スタイル シート)」の略。 HTMLで作った要素を装飾…

HTMLで背景や文字の色を変更する場合

背景の色を変更する場合 <body bgcolor="○○"></body> 文字の色を変更する場合 <font color ="○○"></font> 表全体の背景色を変更する場合 <table bgcolor="○○"></table> 行単位で背景色を変更する場合 <tr bgcolor="○○"></tr> セル単位で背景色を変更する場合 <td bgcolor="○○"></td> ○○の部分には「#FF0000」や「red」等の記述を行い、色の指定を行う。 htmlst.hatenablog.jp

HTMLでのリンクの作り方

HTMLでリンクを作る場合 <a href=""></a> を使用する。 (使用例) <a href="Webサイト等のURL/">Webサイト名等</a> ・画像からリンクをする場合 <a href="Webサイト等のURL/"> <img src="画像のURL" width="10" height="10"alt="画像"></a> ・新しいタブで開かせる場合 <a href="Webサイト等のURL/" target="_blank">Webサイト名等</a> ページ内リンクを作る場合 リンク元 <a href="#文字列">テキスト</a> リンク先 <a name="文字列">テキ…</a>

HTMLで改行する方法

HTMLで改行する方法 HTMLで改行を行う場合、<br>タグを使用する。 (例) ・本文<br> ・本文 <br> のように記述を行う。 (使用例) ーーーーーーーーーーーーーーーーーーー HTML文 1行目の本文<br> 2行目の本文<br> 表示 1行目の本文 2行目の本文 ーーーーーーーーーーーーーー…

<p>タグの意味

<p>タグは文書の段落を表す。 <p></p>の形で使用する。 (使用例) ーーーーーーーーーーーーーーーーーーー html文 <p>これは1つ目の段落です</p> <p>これは2つ目の段落です</p> 表示 これは1つ目の段落です ←1行分改行される これは2つ目の段落です ←1行分改行される ーーーーーー</p>…

onclickで複数の処理を実行する方法

onclickで複数の処理を実行する場合には「,」ではなく、「;」を 使用する。 × <input type="button" value="実行" onclick="処理A,処理B"> ○ <input type="button" value="実行" onclick="処理A;処理B"> (使用例) ーーーーーーーーーーーーーーーーーーー <form action="○○"> <input type="button" value="実行" onclick="処理1;処理2"> </form> ーーーーーーーーーーーーーーーーーーー よく読まれている記事 htmlst.hatenablog.…

HTMLでの色の指定

HTMLでの色の指定 HTMLで色の指定を行う場合、 <font color = "○○" </font> の、○○の部分に「#FF0000」等を記述することで、色の指定を行うことができる。 (赤に指定したい場合) <font color = "#FF0000"</font> <font color = "red"</font> 上記のように「#FF0000」や「red」と指定をすることで、 色を変更することができる。 色の一例 黒:bl</font></font></font>…

<th>タグと<td>タグの違い

<th>タグと<td>タグの違い <th>タグ ・見出しに使用する ・太字でセル内の中央に表示されるようになる <td>タグ ・通常の文書に使用する ・左揃いに表示される (使用例) ------------------- <table border="1"> <tr> <th>商品名</th> <th>商品価格</th> </tr> <tr> <td>パン</td> <td>100円</td> </tr> </table> ーーーーーーーーーーー</td></th></td></th>…

HTMLタグの属性

HTMLタグの属性 ・align 文書の左揃え、右揃え等に使用 (使用例) <td align ="left"> 左揃え <td align ="center"> 中央揃え <td align ="right"> 右揃え ・valign 文書の上揃え、下揃え等に使用 (使用例) <td valign ="top"> 上揃え <td valign ="middle"> 中央揃え <td valign ="bottom"> 下揃え <td valign ="baseline"> ベースラインに揃える ・bgcolor 背景色を指定 (使用例) <td bgcolor="#ff0000"> 赤色に指…</td></td></td></td></td></td></td></td>

HTMLでのコメント文の書き方

HTMLでのコメント文の書き方 (例) ーーーーーーーーーーーーーー ーーーーーーーーーーーーーー よく読まれている記事 htmlst.hatenablog.jp htmlst.hatenablog.jp htmlst.hatenablog.jp

HTMLタグ(基本的な構造をつくるもの)

ドキュメントタイプの宣言 <html></html> HTML文書であることを宣言 <head></head> ドキュメントに関する情報 <title></title> ウェブページのタイトルを指定 <body></body> ページ本体の表示領域

<input>タグについて

<input>タグについて <input>タグ テキスト入力欄や実行ボタン等を作成するタグ。 <form>でデータが送信される際、<form>タグのaction属性で指定した サーバー上のファイルに<form>タグのmethod属性で指定した転送方法で送信。 <input>タグのname属性で付けたデータとその値を一組にして送信。 ・typ</form></form></form>…