와썹 동기 가이즈! 오늘은 마진에 대해 알아보도록 합시다! Margin 마진(Margin) 설정은 경계(Border) 밖의 빈 공간을 나타냅니다. 코드에서의 Margin #margin1 { border: thick solid red; padding: 35px; width: auto; margin: 50px; } #margin2 { border: thick solid blue; padding: 35px; width: auto; margin: 50px; } 마진이 없다면? ※ 조금 뜬금 없는 소리인데 'Wraith awaiting launch orders.' 스타크래프트 1의 레이스가 생산될 때의 대사이다. 항상 '윙거윙어졸스'라고 들려서 그렇게 생각했는데 '레이쓰 어웨이링 런치 오덜스'라니ㅋㅋ 한참을 레이..
안녕하세요 동기 여러분! 오늘은 체크박스 만드는 방법에 대해 알아봅시다! Checkbox Input 이제 우리는 감이 옵니다. 감이 와! type="checkbox"를 하면 나오겠지 뭐 ㅋㅋㅋㅋ 사용자에게 여러 가지의 옵션을 전달받고 싶은 경우 체크박스를 사용해주면 됩니다. 생김새 좋아하는 라면에 체크 하시오! 신라면 진라면 매운맛 너구리 불닭 볶음면 안성탕면 label의 for와 input의 id는 역시나 같아야 합니다. name은 ramen으로 모두 통일 하였는데 이는 모든 체크박스를 그룹화한 것입니다. (name을 아무렇게나 정한다면 나중에 form을 받아서 데이터를 정리할 때 뭐가 뭔지 헷갈려서 일이 진행이 안됨) value는 체크박스 각각과 값(한글로 된 부분)으로 연결이 되어 있는데, 체크박스..
안녕하세요 동기 여러분! 오늘은 사용자가 범위를 조절하여 입력한 내용을 받아내는 아주 귀엽고 깜찍한 방법에 대해 알아봅시다! Range Input 제한된 숫자를 선택하도록 사용자를 유도하는 방법에는 number 보다는 range 가 탁월한 선택일 것입니다. 생김새 넌 잘생겼니? Yes 모르겠는데 No 또 또 또 역시 이전과 마찬가지로 의 for의 값과 의 값은 같아야 합니다. type="range"를 해주어야하고 최소(min)와 최대(max) 값을 설정해줄 수 있습니다. 여기서 step은 마우스나 키보드로 범위를 설정할 때 얼마만큼 가게 할지 선택하는 것입니다. 위의 코드를 실행해보면 이런 화면이 나타나는데 마우스 또는 키보드로 두 칸 움직여보면 두칸 움직였더니 못생겨지는 대참사가 발생합니다... 새로운..
- Total
- Today
- Yesterday
- 반복문
- CSS
- 타입 좁히기
- CSS 포지션
- Python
- Typescript
- 프로그래머스
- css position
- for문
- 타입스크립트
- Type
- 파이썬
- html
- 실수
- 자바스크립트
- em
- method
- Margin
- padding
- html table
- 동기코딩
- 메서드
- 함수
- javascript
- 객체
- Object
- Array
- if문
- function
- HTML 기본
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |