メモ

メモを入力してみよう!


Lesson 06「リストを作ってみよう!」

練習を見る

学習概要

ul,liタグを使ってリストを作ってみよう!
リストはホームページのメニューなどにも使われているよ!

補足

コメントはありません

この練習でわからない所を質問する※部活外の質問はできません

ログインが必要です

この練習への質問一覧

ログインが必要です

Lesson 06「リストを作ってみよう!」 の内容※SEO用のため読めません

前回と同じくフォルダを作成しましょう。【入門】HTML言語・CSS言語初心者テストフォルダを開き新規フォルダの作成を行います。

フォルダを作成したら最初に作った HTM ファイルを中にコピーします。【入門】HTML言語・CSS言語初心者それではコピーしたファイルを編集していきましょう。

 BODY タグの中にこちらの行動変えてみてください。【入門】HTML言語・CSS言語初心者ファイルの編集が終わったら保存をしファイルを開いてみましょう。

一つ目二つ目と聞かれたリストが表示されていれば完成ですはいではコードの説明をしていきたいと思います。リストというものを作るにはご自宅の中にですね有名なタグというものを使ってリストを作っていきますの中にですね Li タグというものを使っていきます。

【入門】HTML言語・CSS言語初心者今回 liter が二つ付いてます Li タブ一つ付ける事にリストがひとつ作られるような形になってますなので Li タグの中に文字列を入れていただければそれがリストとして表示されるような形になります。

実際に画面を見てみると一つ目という書かれたリストが表示されて二つ目とかれているリストが表示されているという形になってますね。【入門】HTML言語・CSS言語初心者猫のリストですね実際どんなとこですかというとこなんですけども例えばホームページのメニューこういうところはですねリストで作られてるんですね。

あのリストっていうのは英語対応しますので覚えていただければと思います。【入門】HTML言語・CSS言語初心者もう一つお得なんですけれども今回このリスト形式というもの UL Li タグを使って書きましたけれどもこういう風にですね紫陽花画面の方を見てもらうとどっとままるですねがついて一つ目二つ目と肩してリストが表示されてます。

それならば P タグパラグラフ持ったですね。【入門】HTML言語・CSS言語初心者俺を使って10つけて一つ目二つ目ってやっちゃってもいいんじゃないのって言う思われるかもしれないんですけれども実際画面上で表示させてみてもですねそんなに変わりはないんです。【入門】HTML言語・CSS言語初心者けれどもただコンピューターの中の表には見えないんですけれども中の方で理解されている内容っていうのは厳密に言えば違ってきますどういうものかと言うと UL Li タグを使った場合にはこれはリストですよでリストとして一つ目というもの二つ目というものがありますよという形で理解されてます。

ただピーターを使った場合データを使った場合にはそのタグの中身はパラグラフ段落になってますよ段落としては役割を持ってますよと言いなります。【入門】HTML言語・CSS言語初心者その段落としてその中に文字列があって10があって一つ目ですよ10勝手二つ目ですよという形の理解になってますのでま普通に人が見るぶんにはそんなに変わりはないんですけれどもコンピューターの中で理解されてる内容って間違ってきますよっていうことになりますので Google の検索とかでもですねこういうタグを見てですね実際検索に引っ掛けたりしてますのでなのでタグによってですね役割とは違ってきますのでそういうところをしっかり理解していただいてちゃんとタグをつけていただければと思います。

【入門】HTML言語・CSS言語初心者はいいかがだったでしょうか OL Li タグを使ってリストを作っていくっていうことですね実際に違う単語を使っても同じような見た目にはなりますけれども意味は違うんだということを覚えておきましょう