👨‍💻 float:left 속성으로 아무리 가운데 정렬을 하려고 노력해봤지만, 카드 요소들의 가로 정렬을 위해 float:left 속성을 사용했다. 가로 정렬은 성공(?) 했지만 가운데 정렬을 하지 못했다.text-align: center; / margin:0 auto; 를 사용해도 도저히 안되는 가운데 정렬 원인은 바로 float:left 속성 때문이었다. .travel-card { float: left;} 카드 요소 class 선택자("travel-card") 로 묶어 float: left; 사용 시 결과 화면이다.요소들이 브라우저의 왼쪽부터 가로 정렬로 나열된다.하지만 내가 원하는 것은 가운데 정렬을 같이 하는 것이었다. 👨‍💻 display: inline-block; 을 사용한 가운데..

👨‍💻특정 부분에 스타일을 적용하는 class / id 선택자 특정 요소에 스타일을 적용하는 타입 선택자 특정 태그를 사용하면 모든 요소에 스타일을 적용할 수 있다.같은 태그라도 일부는 다른 스타일을 사용할 때 class 선택자와 id 선택자를 사용한다.1. 태그 모든 요소에 스타일 적용 HTML CSS JavaScriptp { color: red;} 2. 태그 요소에 class(.) / id(#) 선택자 특정 부분 스타일 적용 HTML CSS JavaScript p { color: red;}/* class 선택자 */.css { text-decoration: underline; color:blue;}/* id 선택자 */#js { te..

👨‍💻사용자 input 박스 안에 원하는 문구를 미리 적어 두는 value=".." placeholder=".."  💡 두 속성의 input 박스 안에 문구를 미리 적어 두는 공통점이 있지만, 몇 가지 차이점이 있다. 💡 - value 속성은 설정된 값을 서버 쪽으로 정보를 전송할 수 있다. 사용자가 input 박스 안에 새로운 값을 입력할 때미리 적어 둔 문구를 직접 지워야 한다.- placeholder 속성은 value와 달리, 서버 쪽으로 정보가 전송되지 않는다. 또한 사용자가 input 박스 안에 글자를 입력할 때,자동으로 입력된 문구가 사라진다.- value 속성을 적용할 경우 placeholder 보다 문구의 글자 색이 더 짙다.value, placeholder 속성 사용 예시DOCTY..