스파르타 코딩 웹개발 종합반/1주차15 1-11 포스팅박스 만들기/ 모바일 최적화 크기 코드: HTML : 별점 --선택하기-- ⭐ ⭐⭐ ⭐⭐⭐ ⭐⭐⭐⭐ ⭐⭐⭐⭐⭐ 코멘트 Dark Secondary CSS : .commentbox { box-shadow: 0px 0px 3px 0px gray; padding: 20px; width: 500px; height: 500px; margin: 20px auto 10px auto; } .input-group { margin-top: 10px; height: 40px } .buttons { margin-top: 15px; display: flex; flex-direction: row; align-items: center; justify-content: center; } .buttons>button { margin-right: 5px; ⭐️모바일 최적화.. 2022. 5. 11. 1-10 Bootstrap_Card / 이모티콘 모음 코드: 영화 제목이다 ⭐⭐⭐ 코멘트를 써주세요 Card: 1. 카드섹션에서 원하는 카드코드 붙여넣기 2. 이미지 넣고 갯수 조절. row-cols-md-3 → row-cols-md-4 로 바꾸기 →화면사이즈가 중간정도 되었을때 한줄에 4개 보임. 이모티콘 모음 https://kr.piliapp.com/facebook-symbols/ 2022. 5. 11. 1-9 CSS 속성(이미지 어둡게 / border/가운정렬) 이미지 어둡게 CSS 에 background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)) , url(””) ↑ 이미지 주소 입력 Border 순서: border: 사이즈 스타일 색상; border: 1px solid white; 내용 가운데 정렬 CSS에 display: flex; flex-direction: column; align-items: center; justify-content: center; ⭐️ display(화면에 어떻게 나타낼지/ 요소크기 결정) 속성 display:~~; None - 화면에서 사라짐. 크기차지도 하지 않음 block- 태그의 기본값. width가 자신의 컨테이너의 100%가 됨. inline.. 2022. 5. 11. 1-8 부트스트랩 시작 https://getbootstrap.com/docs/5.1/getting-started/introduction/ Introduction Get started with Bootstrap, the world’s most popular framework for building responsive, mobile-first sites, with jsDelivr and a template starter page. getbootstrap.com 부트스트랩: 예쁜 CSS 모음집. 이미 작성 되어 있는 CSS를 가져다 사용하는것. 2022. 5. 11. 이전 1 2 3 4 다음
