개발자연습노트

form 레이아웃 제작시에도 포인트는 div박스입니다. 뭘 만들든 일단 예시 디자인 위에 박스부터 그려놓고그걸 그대로 div 박스로 구현만 하면 쉽게 레이아웃 만들 수 있습니다.div 박스부터 배치하고 그 안에 글넣고 그림넣고 input 넣고 그러시면 됩니다.    저는 박스 디자인을 이렇게 해놨습니다. 설명하다  가로로 꽉찬 input들은 w-100 이라는 div에 싸매고,가로로 반반 차지할 input들은 w-50 이라는 div에 싸맸습니다그리고 w-100은 width : 100%w-50은 width : 50%; float : left 이렇게 주었다고 합니다. float 주면 당연히 어딘가에 clear : both 도 있어야겠군요      태그 디..

form은 form 태그로 만들어냅니다.  input태그는 닫지 않습니다.      input의 type 설명하다  옵션110개는 더 있지만 가장 자주 쓰는 것만 모아봤습니다. 나머지는 필요할 때 구글에 찾아쓰도록 합시다.     input에 넣는 속성들 placeholder는 배경 글자,value는 미리 입력된 값,name은 서버 기능개발에 필요한 인풋의 이름을 설정 가능합니다.   HTML의 속성으로 CSS셀렉터를 사용할 수 있습니다. input[type=email] { color : grey}input의 type속성이 email인 요소만 찾아서 스타일을 줄 수 있습니다. 폼에서 특히 유용하게 사용합니다.     전송버튼은  전송둘 중 하나 쓰시면 됩니다.그리고 물론 태그 안에 있어야 잘 작동..

네모 박스 디자인에 많이 사용하는 CSS 속성 설명하다 .box { margin : 20px; padding : 30px; border : 1px solid black; border-radius : 5px;}margin은 바깥 여백,padding은 안쪽 여백,border는 테두리 (차례로 두께, 선의 종류, 색상),border-radius는 테두리 둥글게 처리입니다. 가운데 정렬도 많이 하는데 저번 이미지처럼 display : block; margin-left : auto; margin-right : auto 이렇게 주면 됩니다.    Q. 이렇게 많은 스타일을 다 언제 외우고 있냐고요?외워봤자 맨날 까먹기 때문에 필요하면 구글에서 찾아쓰는게 일반적입니다.      margin과 padding을..