【プログラミングの勉強】HTMLにふれてみる
プログラミングを勉強しています
時間もあるので、プログラミングを勉強してみようと思います。
知識はほぼ0、SQLの入門書を一冊読んだくらい。
利用しているのは「Progate」という無料サービスです。
Progate | プログラミングの入門なら基礎から学べるProgate[プロゲート]
HTMLのしくみ
HTMLでは、テキストに「タグ」と呼ばれる印を付けていきます。図のようにテキストをタグで囲むことにより、テキストが「見出し」や「リンク」といった意味をもつことになります。
テキストをタグで囲む時は、以下の図のように、開始タグと終了タグではさみます。終了タグには「/」が必要な点に注意してください。
----------
<h1>Hello World</h1>
----------
見出しと段落
見出しの要素は<h1>要素以外にも、<h2>, <h3>, ..., <h6>要素があります。
hはheading(見出し)の略です。<h1>が一番大きな見出しで、<h6>が一番小さな見出しになります。
段落を表すのは<p>要素です。 pはparagraph(段落)の略です。
<h2>要素や<p>要素で囲んだテキストは改行されます。
----------
<h1>プログラミングの世界へようこそ</h1>
<h2>Progateとは</h2>
<p>オンラインのプログラミング学習サービスです</p>
----------
リンク
リンクを作成するためには<a>要素を用います。
テキストを<a>タグで囲むことで、簡単にリンクを作ることができます。
実際に表示されるテキストは、<a>タグに囲まれた部分です。
<a>要素にリンクの飛び先を指定するには、href属性を追加する必要があります。
<a href="url">というように書き、url部分にリンク先のURLを指定することで、そのページへのリンクを作ることができます。
----------
<a href="https://prog-8.com">Progateへ</a>
<a href="https://google.com">Googleへ</a>
----------
画像
画像の表示には<img>要素を用います。
<img src="url">のように、src属性のurlの部分に画像のリンクを指定することで、画像が表示されます。
<img>要素はテキストを囲むことがないため、終了タグが要りません。
----------
<img src="https://prog-8.com/images/html/beginner/wanko.jpg">
<img src="https://prog-8.com/images/html/beginner/school.jpg">
----------
リスト
右の図のようなリストを作るには、<li>要素を用います。
箇条書きにしたいテキストをそれぞれ<li>タグで囲むことで、リストを作ることができます。
<li>要素は、囲む要素によって種類が変わるという特徴を持っています。
<ul>要素で囲むと、黒点が先頭につきます。
<ol>要素で囲むと、数字が連番でつきます。
このように要素を要素で囲むことを入れ子と言います。
囲む方の要素を親要素、囲まれる要素を子要素と呼びます。
入れ子構造の要素がある場合は、インデント(字下げ)をします。
インデントは必須ではありませんが、インデントをすることで、入れ子構造が複雑になっても親子関係がわかりやすくなります。行の先頭で「tab」キーを押すと簡単にインデントをすることができます。
----------
<ul>
<li>HTML</li>
<li>PHP</li>
<li>Ruby</li>
</ul>
----------
2/13-14のこと
2月13日(火)
前日19:00くらいに眠ったので、朝4:00に目が覚めてヨガのち朝食。
朝ヨガ、本日はこれ。内容自体ももちろんよいのだけど、聴こえてくる鳥の声や、柔らかいオレンジの日差しが心地よい。まるで自分も外国で朝を迎えているような気分になれました。WOW YOGAの1週間チャレンジも試してみよう。https://t.co/ZgYkYK4DaN
— ニシノ (@n1sh1no) 2018年2月12日
【朝食】白米、大根・白菜・油あげ・さやえんどうの味噌汁、ニラたっぷり厚焼き玉子https://t.co/rgd0lHbf3D
— ニシノ (@n1sh1no) 2018年2月12日
*****
午前中は郵便局へ行って会社へ書類を発送して、駅前の本屋さんを流して4冊本購入。
◆美術手帖(2018年2月号)
テレビドラマ特集の「美術手帖」。バカリズム目当てで買ったけど、どの頁も読みごたえある。
— ニシノ (@n1sh1no) 2018年2月13日
大石静さんのインタビューに、坂本裕二さんの論考、野木亜紀子×古沢良太対談。 pic.twitter.com/IbBRiRG0nU
◆Lily―日々のカケラ―(石田ゆり子)
◆東京みちくさ案内(香菜子)
◆嫌われる勇気
遅めのお昼に、料理本見ながら「ふわとろ親子丼」に初挑戦。
この本、タイトルや挿絵が印象強めだけど(笑)、レシピ本として普通に優秀。
手順少なくて簡単なのにしっかりおいしいのでお気に入り。
*****
午後は家でまったりしながら、病院に日程変更の連絡したり、空也もなかの予約。
「空也もなか」電話がつながりにくいとは聞いてたんだけど、本当に全然つながらなくてびっくりした~。13回目でやっとこつながって無事予約完了。
その後、バレンタインのチョコケーキ作り。
ぎりぎりセーフ!外側サクッと中はしっとりでいい感じ♪https://t.co/MtUys5emB6
— ニシノ (@n1sh1no) 2018年2月13日
焼いてる間にセリアにラッピンググッズ買いに行って、ちょっと冷ましてからゆうゆう窓口で発送。
ギリギリ間に合ったと思ったけど、チルドゆうパックだと15日の午前中になっちゃうとのことで、間に合ってなかった…。
1:30頃就寝。
2月14日(水)
13日タスク多すぎたのか、17時前にやっとベッドから起きた。
何はともあれ、スイッチ入れるためにヨガして、軽くお掃除。
おなかがはっている気がしたので。https://t.co/fKIwdSKguQ
— ニシノ (@n1sh1no) 2018年2月14日
夜(ていうか一食目)は前述の料理本をアレンジした「ベーコンとにらのかきたまスープ」と、ガトーショコラのはしっこ。
1ヵ月休みがあったら、なにをしようか。
Amazonプライムで「しあわせのパン」を見ている。
湖のほとりにあるカフェ「マーニ」には、りえさんの淹れるコーヒーと水縞くんのつくる焼きたてのパン、季節のお野菜の料理。そして、遠くからのお客様が泊まれるよう、2階にはあったかいベッドが用意してあります。
こんな場所で1週間くらいゆっくり過ごしたいなあ、と思う。
今日の朝ごはんは、絶対に天然酵母パンにしよう。
1ヵ月休みがあったら、なにをしますか?
ところで、みなさんは突然1ヵ月間お休みをもらったら、何をしますか?
一人旅、短期留学、資格取得、ひたすらダラダラする…。
色々考えられますが、1ヵ月って長いようで意外と短い。
きっとダラダラ過ごしていたら、あっという間に過ぎてしまうことを私は知っている。
ということで、整理と備忘録のために、お休みの間にやりたいことを思いつくまま挙げてみることにする。
人生の夏休みの計画をたてよう!
1.旅行したい ✓
実はお休みが決まる前にいくつか予定していたので、日程調整をしてそのまま行くことに。楽しみ。
・2月中旬 【台湾】
・2月下旬 【関西】
・3月中旬 【岩手】
2.地元(東北)で2週間くらいのんびりしたい
2週間に一度都内で通院があるのだけど、日程調整して2月末~3月にかけてゆっくり行けたらいいなと思う。
3.人に会いに行きたい
会いたいな、な人。会えていないな、な人。に会いに行こう。
高校の同級生(富山)、大学の友人(岩手)、会社の先輩。
4.5kgくらい痩せたい
これは切実。この機会にぜひ。【①記録/②食事制限/③運動】の三本柱でいく。
①記録
見える!体重管理と食事記録 ハミング ダイエットカレンダーを利用。
②食事制限
以下のルールで。
・できるだけ3食決まった時間に食べる(7:00、12:00、18:00)
・砂糖入りの飲み物、間食は控える
・夜は炭水化物を抜く
③運動
お金をかけないなら【ランニング&動画で筋トレ】だけど、ジムも検討中。
近所のジムが4月末までの在籍で6000円+αなので、近々見学に行ってみよう。
5.読書したい
せっかくなのでたくさん読書したい。時間はあるし。
興味あるのはUI/UXやサービス関連。こばかな(@kobaka7)さんの課題図書を参考にさせていただこうと思ってます。
ただ、最初はもっと自分の生き方や考え方の糧になりそうな本を読みたい。
明日は図書館にも行ってみようと思う。
あ、あとは昔ハマった「マリア様がみてる」も最終巻まで読みたい!
6.ダンスしたい
近くに大人も通えそうなスタジオがあったので、一度見学に行こうかな。
---------------
うん、ざっくりはこんな感じ。
手帳買って喫茶店ランチしながら、のんびりいきますか。