回答編集履歴

1 クラス名変更

masaakitsuyoshi

masaakitsuyoshi score 90

2016/08/18 14:49  投稿

下記でできた。
/* コンテンツの高さが画像の高さより大きい時、動かないように固定 */
 background-attachment: fixed;
入れるか入れないかお好み
```CSS
body {
.hero {
 /* 画像ファイルの指定 */
 background-image: url(images/background-photo.jpg);
 
 /* 画像を常に天地左右の中央に配置 */
 background-position: center center;
 
 /* 画像をタイル状に繰り返し表示しない */
 background-repeat: no-repeat;
 
 /* コンテンツの高さが画像の高さより大きい時、動かないように固定 */
 background-attachment: fixed;
 
 /* 表示するコンテナの大きさに基づいて、背景画像を調整 */
 background-size: cover;
 
 /* 背景画像が読み込まれる前に表示される背景のカラー */
 background-color: #464646;
}
```
[リンク内容](http://coliss.com/articles/build-websites/operation/css/css-responsive-full-background-image-by-sixrevisions.html)

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る