html, css/css
-
CSS 성능을 높일 수 있는 CSS BEM 방법론html, css/css 2018. 5. 9. 17:10
하단의 참고 사이트를 읽고 이해한 것을 정리 하였으며, 천천히 차근 차근히 정독 하셔야 이해가 될 것이라 예상 됩니다, 그리고 혹시 잘못 이해한 것이 있으면 댓글로 알려주시면 정말 감사 하겠습니다. bem 스타일에 대해서 소개하기 앞서 오늘날 대부분의 기기는 초당 60회의 빈도로 화면을 새로 고칩니다. 각 프레임에는 16ms 가량의 시간만 할당 되는데(1초/60 = 16.66ms) 실제로 브라우저는 실행준비를 해야하므로 10ms 내에 모든 작업을 완료해야 합니다. 제한 시간을 충족 하지 못하면 버벅거림 현상이 발생하며 사용자에게 거부감을 줍니다. 완전 간단하게 이야기를 하자면 브라우저가 렌더링을 하는데 여러가지의 과정들을 거쳐서 렌더링이 되는데 그 과정중에서 스타일을 재계산 하고 페이지 또는 페이지 일부..
-
Css 깊이있게_2 inherit(상속)에 대해서html, css/css 2017. 8. 12. 20:45
다른 분들이 포스팅을 안 한 것을 찾던 중에 상속에 대해서는 글 들이 많이 없는 것 같아서 이렇게 정리합니다. w3schools에서 font-size랑 margin을 검색하면 다음과 같이 나옵니다. font-size는 inherited가 yes 이고 margin은 inherited가 no 인데요, 이 차이에 대해서 설명 하겠습니다. 먼저 다음과 같이 코딩을 하고 crome 브라우저 요소 검사 화면을 확인 하면 다음과 같이 나오는데요. .parent_element DIV 에 font-size:24px을 주었는데요, 화면을 확인 해보니 .parent_element DIV 안에 있는 div, p, span 태그에 있는tex도 font-size 가 24px로 바뀐것을 확인 할 수 있습니다. 요소검사 창 우측에 ..
-
Css 깊이있게_1 Css 속성 Default value 정리html, css/css 2017. 7. 22. 22:42
css 속성들이 엄청 많은데요..이 중 저의 경험으로 자주 사용했던 것들만 정리 했습니다. 자주 사용 하는 것들은 외우는게 편하더라구요.필요할때 마다 w3schools 에 검색하는것도 귀찮고 ㅎㅎㅎㅎ(none, 0, normal 이 은근 햇갈립니다..--;;) 정리하면서, 제가 사용은 안했지만 새로 알게 된 것도 함께 정리했습니다. Property Default value display ?https://www.w3schools.com/cssref/pr_class_display.asp물음표라고 나와 있네요;; overflow visible position static float none z-index auto width, height auto max-width, max-height none margin, ..