css レイアウト关连

Posted 2021-05-13

/*スクロールしても下まで背景を伸ばす*/
.container{min-height:100%; display:block; position:absolute;}


/*背景いっぱいに表示させる*/
body {
  /* 画像ファイルの指定 */
  background-image: url(images/background-photo.jpg);
  /* 画像を常に天地左右の中央に配置 */
  background-position: center center;
  /* 画像をタイル状に繰り返し表示しない */
  background-repeat: no-repeat;
  /* コンテンツの高さが画像の高さより大きい時、動かないように固定 */
  background-attachment: fixed;
  /* 表示するコンテナの大きさに基づいて、背景画像を調整 */
  background-size: cover;
  /* 背景画像が読み込まれる前に表示される背景のカラー */
  background-color: #464646;
}
/*１行で書くと*/
body{background: url(background-photo.jpg) center center cover no-repeat fixed;}