실습문제 4-8

WEB/TRAINNING 2017. 11. 4. 19:26 |

8. <img> 태그로 이미지를 출력하고, 액자 모양의 이미지 테두리를 만들어라.

테두리의 두께는 15px, 패딩은 5px로 하여 테두리와 이미지 사이에 공간이 있게하라.


 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!DOCTYPE html>
<html>
<head>
    <title>이미지 테두리 만들기</title>
</head>
<style>
    img
    {
        padding: 5px;
        border : 15px solid white; 
        /* border 스타일먼저 적용되어 있어야함 */
        border-image: url("checkpattern.png") 30 round;
    }
</style>
<body>
<h3>이미지 테두리 만들기</h3>
<hr>
    <img src="sunset.png" width="150" height="100">
</body>
</html>
cs


'WEB > TRAINNING' 카테고리의 다른 글

실습문제 5-1  (0) 2017.11.06
실습문제 4-9  (0) 2017.11.04
실습문제 4-7  (0) 2017.11.04
실습문제 4-6  (0) 2017.11.04
실습문제 4-5  (0) 2017.11.04
Posted by 너래쟁이
: