no image
[CSS] Clearfix Hack
Clearfix 는 CSS에서 부모 요소가 자식 요소의 float로 인해 제대로 높이를 계산하지 못하는 문제를 해결하기 위해 사용되는 기법이다. float 속성을 설정한 요소가 있을 때, 부모 요소는 해당 자식의 요소의 높이를 인식하지 못하게 되는 경우가 있는데 이를 해결하기 위해 사용된다. 이유CSS에서 float 속성을 사용하면 문서에서 떠있는 상태가 된다. 즉, 부모 요소는 자식 요소의 float 상태를 무시하면서 자식 요소가 차지하는 높이를 계산하지 않게 된다. 내용 내용예를 들면, 위 HTML에서 .container 는 자식 요소들의 float 를 인식하지 못하므로 높이가 0이 된다. 따라서 .container 의 배경색이나 테두리 등이 제대로 표시되지 않을 수 있다. 해결방법은 굉장..
2016.08.30
no image
[HTML] 오픈 그래프 메타 태그 (Open Graph Meta)
소개오픈 그래프(Open Graph) 메타 태그는 웹 페이지의 콘텐츠를 소셜 미디어나 메신저에서 공유할 때 어떻게 표시될지를 제어하기 위해 사용되는 HTML 태그이다. 원래 페이스북에서 개발한 프로토콜이지만, 현재 다양한 플랫폼에서 이를 지원한다. 이 태그를 통해 웹 페이지의 제목, 설명, 이미지, URL 등을 명확하게 지정함으로써 각 플랫폼에서 오픈 그래프 정보를 읽어 사용자가 콘텐츠를 공유할 때 깔끔한 정보로 보여줄 수 있게 해준다. 카카오톡이나 SNS 등에서 특정 링크를 붙여놓으면 알아서 만들어주는 기능을 볼 수 있을텐데 그 역할을 하는 것이 이것이다. 오픈 그래프 메타 태그는 태그로 작성하고, 주로 태그 안에 포함된다. 예를 들면 아래와 같이 작성할 수 있다.주요 태그og:title - 공유 ..
2016.08.28