-本日のアジェンダ-
1限目
学科 HTML/CSS基礎⑥
CSSの記述方法について
2限目
学科 HTML/CSS基礎⑥
CSSの記述方法について
3限目
学科 HTML/CSS基礎⑥
Webページ制作実践
4限目
学科 HTML/CSS基礎⑥
Webページ制作実践
5限目
学科 HTML/CSS基礎⑥
本日の講義のまとめ
セレクタの得点について【復習】
セレクタには優先順位があり点数計算をして高得点のものが採用されます。同じ得点の場合は後ろに書いてあるものが採用されます。点数計算の結果によっては前に書いてあるセレクタが採用されてしまうことがありますので意図したスタイルにならない時は点数を確認してください。
CSS：レイアウト系プロパティ【復習】
- width プロパティ（内容の幅）
- max-width プロパティ（幅の最大値）
- min-width プロパティ（幅の最小値）
- height プロパティ（内容の高さ）
- max-height プロパティ（高さの最大値）
- min-heightプロパティ（高さの最小値）
- float プロパティ（回り込み）
- clear プロパティ（回り込みを解除）
- display プロパティ（要素の表示方法）
- overflow プロパティ（ボックスからあふれた内容の処理方法）
FTPについて
FTP（File Transfer Protocol）とは、サーバとクライアントの間でファイル転送を行う際に必要となる通信プロトコル(通信する際の手順や規約)の一つです。
WEBサイトを公開するためには、作成したデータ（HTMLファイルやCSSファイル、画像など）をWEBサーバーに転送する必要があります。FTPソフトを使ってFTPサーバに接続することでファイルを転送することができます。
FFFTP でサーバーに FTP 接続を行うためには、以下の情報が必要です。
【サーバー名】
接続するサーバーのドメイン名です。「サーバー名／ホスト名／FTP ホスト名」などと呼ばれています。
【ユーザー名】
接続するサーバーに登録されているユーザー名です。「ユーザー名／アカウント名」などと呼ばれています。
Webページ制作実践③
実際にサンプルファイルを使用してWebページ制作の手順を確認していきましょう。
- バックグランド系プロパティ
- テキスト系プロパティ
- フォント系プロパティ
- リスト系プロパティ
- レイアウト系プロパティ
- パディング系プロパティ
- マージン系プロパティ
～本日の授業～
〇マージンの相殺や親ブロックへの干渉がある
/*↓margin: 0 auto; 中央配置*/
.oya{
background: #ccc;
width: 800px;
height: 800px;
margin: 0 auto;
padding:50px 0 0 0;
}
・マイナスマージン
微調整に便利
/*
メモ欄
background:#背景（色をつけておくと製作しやすい）
color:色指定
margin: 0 auto; 中央配置
text-align: center;テキスト中央に
text-align:left;テキストを左に
text-decoration: none;下線を消したい場合
display: flex横並びにできる
*/
コメント