본문 바로가기
반응형

참고72

CSS] RESET * CSS 리셋 @charset "UTF-8"; html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details,.. 2021. 11. 9.
CSS] 배경 이미지 화면에 꽉 차게 지정하기 - 브라우저 화면 크기를 조절해도 이미지가 화면에 꽉차게 지정하기 body { height: 100vh; background: url(/image/main_bg.jpg) no-repeat center; background-size: cover; } height 를 100vh 로 줘야한다. 100% 주면 안됨. backgrund-image, background-repeat 으로 따로 써도 되지만, 한줄이라도 줄이기 위해 background: 에 다 넣는다. no-repeat은 이미지를 반복해서 나오지 않게 함. center는 이미지를 가운데 배치. background-size: cover를 넣는다. 이제 브라우저 크기를 작게 했다가 크게 해도 화면안에 그림이 계속 차있다. 물론 비율에 따라 그림이 점점 잘.. 2021. 10. 9.
이미지 슬라이드 - fadeIn/fadeOut 사용 *HTML 2020. 6. 17.
open() 메서드 사용해 팝업창 나타내기 - html 파일 두개 필요 1. 팝업될 창의 html 파일 // 팝업될 창 이미지 파일을 넣어주고 img 태그의 usemap명과 map태그의 name명을 맞춰준다. area태그의 coords 는 이미지의 좌표다. *이미지 좌표 구하기 더보기 클릭 더보기 circle 구하는 방법은 원의 중심에 마우스를 올리면 x y 표가 뜨는데 그것을 적고, 그 중심점에서 반지름 크기를 마지막에 적는다. 코드는 위 코드블럭 참고 (coords="중심점(x, y), 반지름 크기) = (coords="a,b,c) 2. 팝업될 창을 불러오는 html 파일 width=300, height=400 는 팝업창의 가로 세로 크기 left=300은 웹화면 왼쪽에서 오른쪽으로 300 떨어지고, top=50은 웹창 가장 위쪽(주소표시줄 .. 2020. 6. 16.
반응형