목록html & css (9)
개발이야기
디버깅을 위해 F12를 눌러서 확인할때 소스가 안보일때가 있는데 원인을 모르겠다. 소스가 안보일때는 해당 소스에 console.log를 찍고 다시 F12를 누르면 소스가 제대로 보이는 것 같음
내용 이렇게 하면 input 체크박스에 체크했을 시, 아래의 div가 display:none이 적용되어 화면에서 사라진다. 자바스크립트없이도 이런 구현이 가능하다.
이렇게 하면 p 태그 자체가 화면 중앙으로 오게 된다. text-align 속성은 p 태그 내부의 문자열만 중앙으로 오게 하는 것이고, margin:0 auto는 상하마진은 0으로, 좌우 여백은 균등하게 한다는 의미이므로 가운데로 오게 된다.
p, a { } // p와 a 태그 모두 적용 p > a {} // p에 포함된 a태그, 즉 p의 직계자손 a태그에만 적용 p a {} // p에 포함된 모든 a태그, 즉 p의 모든 후손까지 적용된다는 의미
html파일에서 css파일을 포함시키기 위해서는 이렇게 선언하면 된다. 과거에는 type="text/css" 를 사용하기도 했으나 지금은 스타일이 CSS로 통일되어 이렇게 작성할 필요가 없다. 과거 넷스케이프에서는 스타일시트 방식이 "text/javascript" 였다고 한다.
html의 img 태그의 이미지에 링크를 걸어야 할때, 해당 이미지를 여러 구간으로 분할하여 각각마다 다르게 링크를 걸어야 할때가 있다. 이때 태그를 활용한다.
html 테이블 작성시 순서로 작성하는 것이 성능에 유리하다. 사람이 읽을땐 thead, tbody, tfoot 이 직관적이지만, 브라우저는 thead와 tfoot을 먼저 해석하기 때문에 성능에 유리하기 때문이다.
html 문서 작성 후 웹에서 열었을때 문자셋이 깨진다면 다음을 확인해본다. 1. html 파일을 저장할때 utf-8 형식으로 저장 했는지 2. html 상단에 meta 태그를 명시했는지(ex. 이 2가지를 잘 확인해본다.