webページの製作【作業過程 #1-1】
今回の記事は講座編で培った知識がどのように使われているのかという部分について具体的なイメージを持ってもらうためにwebページを実際に作っている様子を記録していくものになります。 実践的な記事になる分多少難しいものやマイナーな実装が出てくるかとは思いますが、その辺は調べて引き出しを増やしていただければと思います。 どんなwebページを作るか 最初に今回のwebページがどういったものにするのかを考えて […]
HTML
1/2ページ
- 2021.10.14
CSSの擬似要素・擬似クラス【HTML&CSS講座 #6】
前回の講座記事ではCSSのプロパティについて勉強しました。今回はCSSの擬似要素・擬似クラスについて学んでいきます。 擬似要素 擬似要素というのはあるコンテンツの一部分にだけ適用したいCSSがある場合に用いられるもので、HTMLの方に負担をかけずにデザインができるようになります。例えばこのサイトの見出し部分を見てもらうとわかりやすいと思いますが、最初の一文字だけに違うCSSを適用してますよね(最初 […]
- 2021.10.12
CSSのプロパティ【HTML&CSS講座 #5】
前回の講座記事ではCSSの基本的な部分について勉強しました。今回はCSSのプロパティについて勉強をしていきます。 CSSのよく使うプロパティ この講座で勉強するプロパティを一覧にしてみました。復習する時にお使いください。 プロパティ 説明 font系,text系 文字に関する指定に使う(HTML&CSS講座#4) color, background系 色,背景に関する指定に使う width […]
- 2020.01.08
- CSS, HTML, programming,
CSSの基本【HTML&CSS講座 #4】
前回までで一通りHTMLのタグの話が終わったので、今回からCSSの方に入っていきます。HTMLよりは覚えることが多く大変ですが、その分webページを装飾できるようになるので、デザインを楽しみつつ学んでもらえたらなと思います。 CSSの基礎 最初にCSSを使うための基礎としてHTMLファイルとの関連づけをする方法を学びます。CSSを書いたファイルが実際にHTML文書に適用されるために書かなければなら […]
webページの製作【作業過程 #1-2】
前回の記事を見ていない人は前回の記事から見ることをおススメします。 webページの製作#1-1 前回に引き続き、実際にwebページを作成している様子を見てもらいます。前回までのところでheaderタグの中身はほとんど作成し終わっているので今回はfooterや記事のメイン部分を作成していきます。 header部分の残り物 headerタグの部分で唯一残っていたh1タグのデザインしていきます。CSSで […]
HTMLの基本<後半>【HTML&CSS講座 #3】
前回に引き続きこのシリーズでは『Webページの制作ができるようになる』というのを目標にHTMLやCSSを学んでいきます。 早いもので今回の記事でHTMLの知識はほとんど習得できることになります。やや詰め込みすぎた感じがしますが、それだけ重要な情報を盛り込んであるので頑張っていきましょう。 覚えずに印刷してチートシートっぽく使うのもアリだとは思います。 前回の続きということで、早速bodyタグの中に […]