테스트 사이트 - 개발 중인 베타 버전입니다

박스형태의 이미지들 가로진열 채택완료

래비두라 11년 전 조회 4,094


박스형태의 각각의 이미지들을 첨부한이미지와 같은 형태로 진열하고 싶습니다.

가로 진열은 display:inline;으로 하면 될꺼라고 생각했는데 CSS초보라...

진열이 뒤죽박죽 되네요

그리고 이미지를

<DIV><IMG--------></DIV>

<IMG----------->

 

둘중에 어떻게 해야 되는지 알고 싶습니다^^ 

 

 

 

 

제가 작성한 HTML파일입니다.

<!DOCTYPE html>
</html>
<head>
 <title></title>
<style type="text/css">
 
#1 {
 display:inline;
}

 


</style>


</head>

<body>

 

 

<div id="1"><img src="http://www.jungdo03032.cafe24.com/SkinImg/2/1.jpg"/></div>
<div id="1"><img src="http://www.jungdo03032.cafe24.com/SkinImg/2/2.jpg"/></div>
<div id="1"><img src="http://www.jungdo03032.cafe24.com/SkinImg/2/3.jpg"/></div>
<div id="1"><img src="http://www.jungdo03032.cafe24.com/SkinImg/2/4.jpg"/></div>
<div id="1"><img src="http://www.jungdo03032.cafe24.com/SkinImg/2/5.jpg"/></div>

 

 

 

 

</body>
</html>​

 

 

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

채택된 답변
+20 포인트
11년 전

요소의 id는 고유한 것입니다.

페이지에 딱 하나만 있어야 됩니다.

그리고 <div>로 시작했으면 마지막에 </div>로 닫아줘야 하구요.

 

그리고 위와 같이 정렬하실려면

단순히 그렇게만 해서는 될것 같지 않고...(질문을 잘 이해를 못하겠지만...)

일단 세로로 <div>를 세개를 만들고

각각에 가로로 <div>로 내용을 채워야 할 것으로 보입니다.

 

그리고 특별하지 않은 이상은 id대신 class로 처리하시는게...

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

11년 전

다시 정확히 예제 이미지를 보여드리면

 

 

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인