퍼블리싱/CSS 검색 결과

해당 글 19건

rem 과 em

EM 상속된 폰트사이즈 * em = px 로 변환됌. 12345678.parent{ font-size:20px; .child{ font-size:14px; width:2em; }} cs parent로 부터 20px를 상속받았으므로 child는 20px을 상속받음. child의 width = 20px * 2em 이므로40px을 width 값으로 가짐 그러나 child에 font-size가 14px로 지정이 된다면 width = 14px * 2em = 28px을 너비 값으로 가짐. REM(Root EM) 최상위 요소의 폰트크기 * rem 의 공식HTML의 폰트크기가 설정되지 않았다면 브라우저 설정값이 효력을 가짐. EM - 상위요소로 부터 상속받은 폰트크기 혹은 자신에게 설정된 폰트크기 * emREM - 최..
퍼블리싱/CSS 2016. 6. 21. 14:12

효율적인 CSS 작성법

결론결론부터 말하자면 중복되지 않는 클래스명으로 직빵으로 css를 주는것이 제일 좋다. 1. Universal 규칙을 피해라12* { ... }[hidden="true"]{ ... }cs 2. ID규칙에 쓸모없는 태그나 클래스를 붙이지 말아라1234button#Button {…} /* 나쁨 */.menu#Icon {…} /* 나쁨 */#Button {…} /* 좋음*/#Icon {…} /* 좋음 */cs 3. 클래스 규칙에 쓸모없는 태그를 붙이지 말아라12tag.class {…} /* 나쁨 */.sub-menu {…} /* 좋음 */cs 의미가 있는 이름을 사용하는 것이 최선임. 4. 가장 명확한 규칙을 적용하라12tag > tag > tag {…} /* 나쁨 */.c-detail {…} /* 좋음 */..
퍼블리싱/CSS 2016. 6. 21. 13:11

SASS와 SCSS에 관하여

SASS / SCSS 소프프웨어 공학 - DRY 원칙Don't Repeat Yourself 반복되는 코드를 만들지 말 것!CSS는 이것이 힘들었다. 그래서 CSS의 반복적인 부분을 재활용하고 구조적으로 CSS를 사용하기 위해 나온 것이 SASS와 SCSS 이다. 둘은 비슷한데 문법적인 차이임.SASS - 자바스크립트와 비슷SCSS - CSS와 비슷 Ruby 를 다운받고 설치. watch를 해줌으로써 SCSS와 CSS파일간의 실시간 동기화가 이루어진다. sass -E utf-8 --watch --style compact style.scss:style.css 1. encoding UTF-8 에러시 ruby가 설치된 폴더에서 registry.rb 파일을 검색 해당파일 열고 70번 라인쯤에LOCALE = Enc..
퍼블리싱/CSS 2016. 6. 20. 14:55

IR기법

IR 기법은 이미지 대체텍스트 제공을 위한 CSS 기법으로 다양한 CSS 기법을 사용하여 이미지 대체텍스트를 제공할 수가 있으며, 이 중에 널리 알려진 기법들을 소개하고자 한다. Daum은 이러한 여러 가지 기법 중에서 Phark Method와WA IR 기법을 주로 사용하여 대체텍스트를 제공해주고 있다. 출처 : http://darum.daum.net/convention/css/css_ir Phark Method 이미지로 대체할 엘리먼트에 배경이미지를 설정하고 글자는 text-indent를 이용하여 화면 바깥으로(-9999px만큼 내어 쓰기) 빼내어 보이지 않게 하는 방법 WA IR , Farhner Image Replacement 등의 기법이 있지만 위 기법을 권장함.
퍼블리싱/CSS 2016. 6. 9. 14:00