[css] 글, 이미지 가운데 정렬 세트 + body 여백 없애기 설정
[css] 글, 이미지 가운데 정렬 세트 + body 여백 없애기 설정 가운데 정렬을 위한 display, direction, content, align 설정 display: flex; flex-direction: column; justify-content: center; align-items: center; body 여백 없애주기 왜? : HTML 태그의 기본적인 여백을 없애줘야 편하기 때문이다. body, h1, h2, h3, h4, h5, h6, p { margin:0; padding:0; } 밑줄 효과 css 설정 .title { text-decoration: underline; } text-decoration 종류 underline : 밑줄 긋기 overline : 텍스트의 위에 밑줄 긋기 li..
2022. 2. 3.
간단한 쇼핑몰 페이지 만들기 (+ HTML, CSS, Bootstrap)
간단한 쇼핑몰 페이지 만들기 (+ HTML, CSS, Bootstrap활용) HTML, CSS, Bootstrap 바탕으로 간단한 쇼핑몰 페이지를 만들어 보았다. (우선은 한 페이지) 기획서를 참고하여 필요한 부트스트랩 중, div class="input-group", option(갯수) 선택할 수 있는 select 등 이미지는 css에서 background-img로 삽입해 주었다. 마지막으로 간단하게 주문하기 버튼을 눌렀을 때, JavaScript로('주문이 완료되었습니다!')기능까지 넣어주어 아주 간단한 원페이지 쇼핑몰 완성! 간단한 쇼핑몰 페이지 코드 행복을 팝니다 가격:1,000원/개 행복한 순간을 담을 수 있는 곳은 우리의 머리, 가슴 그리고 또 하나, 사진이 있죠 당신의 행복한 순간을 사진에 ..
2021. 12. 28.