160920 #008 예제 풀이

0.

<form id="main_form" action="#" action="get">
</form>

 

1. 위 아래로 붉은 라인 한 줄 씩

hr / border line

2. 글자들 가운데 정렬 > 테이블로 정렬

<tr> - <th>(bold + center) / <td>

3. 비밀번호 힌트/답변 > select/option

4. 메일/sns 정보 수신 > radio type button / label

5. 관심분야 > checkbox type button / label

 > name을 같게 해야 중복 체크가 안된다. 

6. 붉은 라인 밑에 button

 

---

교재 p.4

 

 

inline으로 된 tag > 크기를 줄 수 없다.

 

block으로 된 tag > 크기를 줄 수 있다.

 

 

• 자손 float:left.. →  부모 overflow:hidden;

• 자손 position:absolute; → 부모 position:relative;

• margin-right : -200px;  → 자손 padding-right:200px; 

• padding, margin 등으로 화면보다 커지면서 레이아웃이 깨지는 현상을 방지하는 방법

• box-sizing:border-box; 대신 쓰는 방법

---

CSS Properties

반응형 웹의 기본이랄까

 

@media

 

@import