고양이 사진도 같이 늘려서 오른쪽 padding도 20px가 되도록 맞추고 싶은데 어떻게 해야 하나요?
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>박스 모델</title>
<style>
div.inner {
background : yellow;
padding : 20px;
border : 5px dotted red;
margin : 30px;
}
</style></head>
<body>
<h3>박스 모델</h3>
<p>margin 30px, padding 20px, border 5px의 빨간색 점선</p>
<hr>
<div class="inner">
<img src="media/mio.png" alt="고양이눈">
</div>
</body>
</html>
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 수 |
|---|---|---|---|---|
| 공지 |
읽어주세요! 연습문제 및 실습문제 정답 공개에 관한 공지입니다.
|
관리자 | 2017.06.20 | 18214 |
| 242 | 이벤트 관련 질문 3 | 왕초보 | 2020.05.24 | 125 |
| » |
예제 4-14 질문이욤
2
|
코딩딩 | 2020.05.17 | 112 |
| 240 | Image 객체 2 | 초보 | 2020.05.14 | 126 |
| 239 | 76페이지 1 | ramoss | 2020.05.13 | 44 |
| 238 | 예제 4-11 질문합니다. 2 | 초보 | 2020.05.04 | 88 |
| 237 |
list type 질문이요
2
|
021 | 2020.05.03 | 107 |
| 236 |
168p 예제4-8 질문
2
|
그냥초보 | 2020.05.01 | 79 |
| 235 |
185쪽 질문있습니다..
3
|
ㅇㅇ | 2020.04.30 | 62 |
| 234 |
css3로 웹 페이지 꾸미기
3
|
ㅇㅇ | 2020.04.30 | 107 |
| 233 | 예제4-5 질문드립니다. 3 | 초보 | 2020.04.27 | 97 |
| 232 |
그림이 안떠요(실습문제 4장 7번)
2
|
초보자 | 2020.04.27 | 684 |
| 231 | 이미지를 어떻게 나오게 하나요? 1 | 나나 | 2020.04.26 | 78 |
| 230 | 3장 실습문제 2번에 쓰이는 이미지 파일은 어디에서 받을 수 있나요? 1 | dpdms0926 | 2020.04.22 | 180 |
| 229 | 예제 5-3 220page 2 | 호기심 | 2020.04.16 | 355 |
| 228 |
94p 그림2-4 질문
2
|
그냥초보 | 2020.04.15 | 51 |
| 227 |
1장 그림1-14
2
|
000 | 2020.04.14 | 119 |
| 226 |
4장 연습문제 8번 질문이요
4
|
코딩은코딩코딩해 | 2020.04.14 | 250 |
| 225 |
인터넷 익스플로러 재질문이요
2
|
021 | 2020.04.13 | 125 |
| 224 |
인터넷익스플로러 질문이요
1
|
021 | 2020.04.10 | 48 |
| 223 | 3장 실습문제 5번문제에 대해 질문이있습니다. 1 | CHUL | 2020.04.09 | 221 |
아래와 같이 이미지 요소의 height와 width를 %단위의 스타일을 지정할 수 있습니다.
해보세요.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>박스 모델</title>
<style>
div.inner {
background : yellow;
padding : 20px;
border : 5px dotted red;
margin : 30px;
height : 100px; /* 여기 주목 */
}
</style></head>
<body>
<h3>박스 모델</h3>
<p>margin 30px, padding 20px, border 5px의 빨간색 점선</p>
<hr>
<div class="inner">
<img src="media/mio.png" style="height:100%;width:100%" alt="고양이눈">
</div>
</body>
</html>