background-clip: content-box 배경을 content영역에만 보이도록 한다
html)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 | <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, height=device-height, minimum-scale=1.0, maximum-scale=1.0, initial-scale=1.0"> <title>Insert title here</title> <style> div { background: url(images/tile.png); background-color: #FFA7A7; /* background-clip: content-box 배경을 content영역에만 보이도록 한다 padding 영역에는 배경이 보이지 않는다 */ background-clip: content-box; padding: 30px; height: 300px; border: 1px solid #000; } </style> </head> <body> <div></div> </body> </html> | cs |
결과
'IT > - 프로그래밍' 카테고리의 다른 글
| HTML5/CSS3 div태그 좌우 반으로 나누기 (0) | 2017.06.10 |
|---|---|
| HTML5/CSS3 background-origin: content-box, background-origin: border-box (0) | 2017.06.09 |
| HTML5/CSS3 background-position : 배경이미지 위치 지정하기 (0) | 2017.06.07 |
| HTML5/CSS3 background-repeat 배경이미지 반복여부 설정 (1) | 2017.06.06 |
| HTML5/CSS table 태그 쓰지 않고 테이블 표현하기 (0) | 2017.06.05 |