TIL#6ページ作成2
内在的な美感の限界を体験する课题私...更に装飾することができません...これもデコレーションじゃないけど….
コードを減らします! 管理は傘下で、パソコンと携帯電話で確認している.
アドレスを打つのは、やはり英語名の方がいいので、メニュー名と同じ名前でファイルを設定したほうがいいので、前の「自己紹介」で.「html」は「Home」htmlに切り替え
住所:、、、、、、
結果:約170行->約150行
divtag個数を減らす->まだ感じてないけど、これが多すぎるとあまり良くないみたい
classセレクタの使用:同じ効果を持つidセレクタをclassセレクタに変換し、1行だけ繰り返して減少しても!
Webpage->チェック項目に入り、正しく実装されていないコードをチェックしてクリアします.
画面サイズに伴うフォントサイズの変化を調べるfont-size tag
(SNSアイコンの下でぼかしフォントを変更)(vw=viewwidth)フォント設定tag調査(すべて/私が選択したフォント=serifに適用) middle 3では、異なる上下線タイプ(上破線、下破線) を用いる. Yummyページの生成(リンク検証のみ)
(肥えた腸の鍋、大きな防御がありますハハ)
携帯(私の携帯標準GalaxyS 10)の解像度は思ったより高く、最大幅:790 px;無効に設定!
(最大幅:1290 px;動作可能)
->正確な数字はわかりませんが…まず、すべての反応型項目1290 pxを;ジェジュン完成! の大きなディスプレイで開けてみると、真ん中がちゃんと揃えられていません...
.medial 1自体が与えるのはmarginではなくpadding値程度で、中の扁枕と歓迎語を相対的に真ん中に集中させます.
->文字と画像を別々に入力しているので、このようなトラブルがあるようです.2つ同時に入力すると、もっと簡単に、、、、?しかし、まず1行1行に効果を与えたいので、それを考えてから変えましょう!今のところここまで!
Aboutmeの3枚の図も左側に集まり、これは#AboutのMarin値がauto、grid効果列:1 fr 1 fr;指定、画像が大きすぎないようにwidth:60%に指定します!
住所:github IDです.github.IO/フォルダ名/列ページ名
Full screen ver.
width =< 1290px
Aboutme:クリックして新しいtapを開きます.それとも通知窓口ですか?表示のみを指定するかどうかを指定します(ただし、プロンプトウィンドウを表示する方法はまだ分かりません!)
Hello! I'm Chae hyun. この行では、画面サイズに応じて、ChaeとHyunがそれぞれ改行されます.一緒に移動する方法?!
今すぐハロー!わあ、私の車賢乙行を変えたので、そんなに移動しない(全く偶然)
勉強してから...
n/a.ターゲット
変更
ファイル名をリセット
住所:、、、、、、
重複除外
結果:約170行->約150行
divtag個数を減らす->まだ感じてないけど、これが多すぎるとあまり良くないみたい
classセレクタの使用:同じ効果を持つidセレクタをclassセレクタに変換し、1行だけ繰り返して減少しても!
Webpage->チェック項目に入り、正しく実装されていないコードをチェックしてクリアします.
補足
画面サイズに伴うフォントサイズの変化を調べるfont-size tag
(SNSアイコンの下でぼかしフォントを変更)(vw=viewwidth)
font-size: #vw;
font-family: serif;
border-top: 2px dotted gray;
border-bottom: 2px solid gray;
(肥えた腸の鍋、大きな防御がありますハハ)
携帯で出力
(最大幅:1290 px;動作可能)
->正確な数字はわかりませんが…まず、すべての反応型項目1290 pxを;ジェジュン完成!
並べ替えのリセット
.medial 1自体が与えるのはmarginではなくpadding値程度で、中の扁枕と歓迎語を相対的に真ん中に集中させます.
->文字と画像を別々に入力しているので、このようなトラブルがあるようです.2つ同時に入力すると、もっと簡単に、、、、?しかし、まず1行1行に効果を与えたいので、それを考えてから変えましょう!今のところここまで!
Github hosting
住所:github IDです.github.IO/フォルダ名/列ページ名
Full screen ver.
width =< 1290px
やるべきこと
Aboutme:クリックして新しいtapを開きます.それとも通知窓口ですか?表示のみを指定するかどうかを指定します(ただし、プロンプトウィンドウを表示する方法はまだ分かりません!)
Hello! I'm Chae hyun. この行では、画面サイズに応じて、ChaeとHyunがそれぞれ改行されます.一緒に移動する方法?!
今すぐハロー!わあ、私の車賢乙行を変えたので、そんなに移動しない(全く偶然)
勉強してから...
middle 1部分では左右の空白のためフレーム選択者を左右に置き、3等分して並べ替え・・もう1人のイメージvertical-align: middle
文字の横に画像があるように設定します!△でも、画面が小さくなると、文字が1文字ずつ落ちてしまいます.
grid効果でsectionをrepeatに与えると、一定の重複sectionが生成されます!「画像検索カード」の裏面のように、一定の間隔、一定の構造を作ることができます.grid-template-column: repeat(5, 1fr);
5つの断面は1の割合で並列構造に配列されています
各アクティブコードに{}}を追加
使ってこそ理解できる.
背景画像は複数あり、コードの一番下の行が画面の一番下に押されます!
Navigation barでページを移動するとき、アクティブなページに対応するメニューのテキスト色を変更...Activeをクラスに...うん...やってみよう!
font awesomeページの使用
display: flex;
水平方向に垂直にした後
flex-direction:列をください
KakaoTalkダイアログウィンドウのように並びます!(左右に重複する垂直構造)
スクリーンスケール
私のページでは、pxを%に指定し、スクリーンスケールに適応するように%に調整します.remを利用すると同じ効果があります!
%を使用する場合は1つずつ置換する必要がありますが、remを使用する場合はpxを使用しますが、上記の効果は得られますか?
同じページで、特定のクリック時に位置をすばやく移動するtag...ショッピングモールの窓口で下~上にクリックしたtopキーの方が効果的!i tag ??
YouTubeのNo Mad Codeを一度見てみるのもいいです(初心者にはいい講座です!)
Reference
この問題について(TIL#6ページ作成2), 我々は、より多くの情報をここで見つけました
https://velog.io/@c_hyun403/TIL-6-Web-page-제작2
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
vertical-align: middle
grid-template-column: repeat(5, 1fr);
Reference
この問題について(TIL#6ページ作成2), 我々は、より多くの情報をここで見つけました https://velog.io/@c_hyun403/TIL-6-Web-page-제작2テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol