HTML + CSS 내가 헷갈렸던 부분 (진짜 완전 기초)

Element : html안에서 동작하는 태그들 (<p>,<img>,<h1>,,,)
Attribute : Element안에 있는 다양한 속성 (src, width, name,style,,,)

 

 

 

**한 element에 여러 스타일을 주고싶을 경우 한칸 띄우고 적으면 된다.

<p class="style1 font1">I am red </P>

 

**event

<button type="button" onclick="javascript:alert('click button!!');">Click</button>

 

클릭시 알림창에 문구 뜨기

 

**element:table

    <table> --> 큰 틀
        <th> --> head
            <tr> --> 행
                <td>이름</td> --> 셀
                <td>나이</td>
                <td>성별</td>
            </tr>
        </th>
        <tbody>  --> body
			<tr>
                <td>홍길동</td>
                <td>19세</td>
                <td>남자</td>
            </tr>
        </tbody>
    </table>

 

 

**만약 style을 td에 주고 싶은 경우 

 

1. 자식 선택자

css에 스타일을 줄 때 사용하는 element 태그들을 selector(선택자)라고 한다. 

.tb>th>tr>td { --> 이렇게 경로를 적어 주면 된다.
	background-color:pink;
    font-size:large;
}

= 경로 밑에 있는 선택자에게만 스타일 적용

 

2. 하위 선택자 

.tb td { 
	background-color:pink;
    font-size:large;
}

= tb 선택자 밑에 있는 모든 td에 스타일 적용