CSS에서 배경 이미지를 만드는 방법

Question

전 webdesign에 익숙하지 않고 완전한 배경 이미지를 만드는 방법을 완전히 모를 수도 없습니다.

typescriptlang.org에서 warship.ts 예를 사용 중입니다. 전함의 배경 사진을 추가하려고합니다. 다음은 CSS 파일의 코드 :가 IDE로

html 
{ 
width: 100%; 
height: 100%; 
-ms-content-zooming: none; 
margin: 0px; 
border: 0px; 
padding: 0px; 
background-image: url(pictures/cats.jpg); //My code 
background-size: cover; 
} 
body { 
font-family: Verdana; 
width: 100%; 
height: 100%; 
/*background-color: #b5caae;*/ 
background: url('img/bg2.jpg'); 
margin: 0px; 
border: 0px; 
padding: 0px; 
min-height: 480px; 
min-width: 640px; 
} 
#header { 
width: 100%; 
height: 25%; 
} 
#boards { 
width: 100%; 
height: 75%; 
} 
.quadrant 
{ 
display: inline-block; 
box-sizing: border-box; 
-moz-box-sizing: border-box; 
width: 40%; 
margin: 2%; 
vertical-align: top; 
} 
#banner { 
font-size: 40pt; 
font-weight: 800; 
font-style: italic; 
color: white; 
text-shadow: -1px 0 black, 0 2px black, 1px 0 black, 0 -1px black; 
height: 100px; 
} 
#status 
{ 
width: 80%; 
border: 1px dotted gray; 
padding: 1%; 
background-color: #CCCCCC; 
height: 80%; 
} 
.board { 
background-color: #111111; 
border: 2px groove black; 
height: 80%; 
padding: 0%; 
position: relative; 
} 
.cell { 
box-sizing: border-box; 
-moz-box-sizing: border-box; 
float: left; 
height: 10%; 
width: 10%; 
border: 1px dotted #A0A0FF; 
margin: 0px; 
padding: 0px; 
position: relative; 
} 

.notBombed { 
opacity: 0.2; 
background: url('img/bg.jpg') repeat; 
/*background-color: black;*/ 
z-index: 0; 
} 

.cellHit { 
opacity: 0.5; 
background-color: #C00000; 
z-index: 2; 
} 

.cellMiss{ 
opacity: 0.5; 
background-color: #008000; 
z-index: 2; 
} 

.ship { 
position: absolute; 
box-sizing: border-box; 
-moz-box-sizing: border-box; 
margin: 0%; 
padding: 0%; 
width: 10%; 
height: 10%; 
border-radius: 20%; 
/*background-color: #FFFF80;*/ 
background: #666666; 
border: 2px solid black; 
z-index: 1; 
-ms-touch-action: none; 
} 

.dropTarget { 
background-color: white; 
} 

, 나는 온라인 내가 본 예제에서 비주얼 스튜디오 2015을 사용하고, 내가 솔루션 탐색기에서 URL의 이미지를 배치, 그때 그것을 참조 html 메서드를 호출 한 다음 이미지를 색상으로 설정합니다. 그러나 실행하려고 할 때마다 아무 것도 변경되지 않습니다. 코드에서 누락 된 부분이 있습니까? 아니면 잘못된 부분에서이 부분을 업데이트하고 있습니까? HTML/ts 코드를 변경해야합니까? 당신은 모든 해상도에서 배경 이미지를 HTML로 시도하는 경우

Answer 1

,

background: url(pictures/cats.jpg) no-repeat fixed; 
-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover; 
background-size: cover; 

는 body{} 부문이 작업을 수행 할이 코드를보십시오. 다른 섹터에서 배경 이미지 코드를 제거하십시오.