HTML
CSS
ドットインストール
プログラミング初心者

受講講座

  • ドットインストール
    • HTML入門
    • CSS入門

HTMLの発見

  • ナビゲーションを示す際に用いる nav
  • 外部サイトへのリンク設定時にtarget="_blank"で新規立ち上げ。
  • a href="mailto:○○@○○"でメールが送れる。画像にも適応できる。
  • 別ページに飛ばすには、○○.htmlを作り、a href="○○.html"で飛んでいく。

cssの発見

  • スラッシュを付けてしまったために、読み込みが実行できずにいました。試行錯誤をしまくって要らないことに気付いたのは、4時間後ぐらいでした。
<link rel="stylesheet" href="css/style.css">

<link rel="stylesheet" href="/css/style.css">
  • 色の表現方法
color: rgb(0, 255, 0);

↑red green blue の頭文字

#oo oo ff
赤  緑  青

コピペに頼りすぎて知らないことばかりでした。

  • aタグのプロパティ
text-decoration: none;

リンクの下線が消える

color: inherit;

bodyタグにfontを設定したのに反映されていない。親要素を引き継がせるため使う。見直してみて分かったけど、自分の説明の意味が理解できない笑

  • border
border-radius:

四角を丸くする

疑問点

  • marginの設定が全体的に分からない。講師はここは○○pxにしたら良いとか、topが〜 bottomが〜っていう話は頭が追い付かなかったです。marginの相殺もなんとなく理解できたけど、まだ足りない。
  • floatで要素の位置を変更する所は説明の速さに付いていけなかったので、あとで使い方を確認しておく。
  • GitHubに記録を残そうと全コピペ(linkを少し弄る)したのに、CSSが読み込まれず、色なし画像なしのポートフォリオになってしまった。 GitHub MyPortfolio

スクリーンショット 2018-05-05 23.45.01.png

太郎くんの自己紹介のところがなぜか左に寄ってしまった。真ん中にもっていこうと変更すると、「楽しいゲームです」が中央揃えになってしまった。前にも同じようなことが起きたけど、その時もよく分からず放置のままだったような気がする。

感想

ポートフォリオを作るのにhtmlとcssで簡単に作れてしまうことに驚いた。あと、cssが有能すぎた。そんなことも出来るのか、cssは!って何度もなりました。