layoutを使って画面を縦に分割するWeb開発2019.05.02自分は基本的にはバックエンドエンジニアなんですが、GWだし時間あるしフロントエンドも触ってみようかなと思って触ってみました。CSSとかほぼ初めて触ったので、初心者が躓くところすべてに躓いてる感あるので、もう躓かないように備忘録がてら記事にしておきます。layoutを使用します。layoutは2次元のレイアウトをするための機能で、\(n\)行\(m\)列に画面を分割できます。この機能を使って画面を2行1列に分割してやります。下記のようなhtmlファイルを用意します。</body></html>そして、このようなCSSを用意してやると、上側と下側が8:2の割合で分割されると思います。1;}こんな感じで8:2で領域が分割されます。上側部分だけスクロールさせたい場合さて、上記が基本となるのですが、このままですと上側部分に表示すべきコンテンツが増えてきた場合、このように下側部分まではみ出してきてしまいます。これを解決するために、コンテンツがはみ出した場合、上側部分のみスクロールするようにしてみます。scrollを追加してやるだけです。1;}すると、下記のように下側にはみ出した場合は自動で上側部分のみスクロールするようになります。使って簡単・自由に操作できる、CSSの新しい機能です。7.5にnginxを導入したのでそのメモです。コメントをキャンセルメールアドレスが公開されることはありません。管理人についてそのうちサイエンス領域の仕事に関われたらなーって思ってるITエンジニアです。間違いがあればコメント欄から知らせてくれると泣いて喜びます。管理人についてそのうちサイエンス領域の仕事に関われたらなーって思ってるITエンジニアです。間違いがあればコメント欄から知らせてくれると泣いて喜びます。フォローツイートカテゴリーAndroidlinuxWeb開発Windowsサーバ運用ブラウザ拡張プログラミング便利ツール。