2020년 2월부터 회사에 입사한지 어느 덧 4개월차가 되었다.
4개월동안 일을 하면서 그동안 몰랐던 것들을 많이 배우게 되었다.
그리고 학원에서 배우지 않았던 것들이 실제 실무에서 많이 활용되는것도 있었다.
그래서 지금까지 배운것들을 하나씩 나열해 보며, 정리하는 시간을 가지자.
각 브라우저 캐시 지우기, firefox 새로고침 : ctrl + F5
참고 : https://wishml.tistory.com/26
jquery의 cdn 라이브러리의 cdn보다는 인터넷이 안되는 환경에서 작업할 것을 대비해
다운로드 받아 작업해야한다.
모바일 이미지는 항상, 짝수로 표현 모바일 레티오때문에 이미지가 흐려질 수 있다.
자식선택자를 남발하지 말것, 나중에 유지 보수(수정)이 어려워 질 수 있다.
보통 form태그는 백개발에서 사용하기 때문에, form요소의 style을 변경하지 않는것이 좋고, 선택자로 잡는것도 피한다.
{div}, {span} element들은 아무런 의미가 없는 태그들 이다.
그래서 레이아웃을 잡을용도로 많이 사용하고
div는 display:block을 사용하고 싶을 때, span태그는 display:inline을 사용하고 싶을 때 사용한다.
안드로이드폰이 아닌 ios에서 viewport가 바뀌면 즉,
( 사용자가 세로로 보던 화면을 가로로보게되면) font-size가 자동으로 조절되는 경우가 생긴다.
그것을 방지하기 위해 {-webkit-text-size-adjust:none}값을 주어 ios폰에서의 폰트사이즈 자체조절을 막아준다.
참고 : https://developer.mozilla.org/en-US/docs/Web/CSS/text-size-adjust
input 태그는 따로 font-family를 지정해주어야 한다. body 태그에 font-family를 주어도 안먹히기 때문이다.
이러한 태그들이 종종 있는데, 그 이유는 태그자체고유의 값이 있기 때문이다.
Naming, 형태의미상태 순으로 조합(btn_apply_on.jpg)
id는 camelCase, class는 underscope사용
prefix / subfix / suffix 정의 접두사를의미, (tab_notice, tbl_product)
box-sizing:border-box는 width와 height 기준으로 잡힌다. 즉, padding 기준으로는 잡히지 않음.
슬릭에서 컨텐츠를 한번 div로 감싸준다, 유지보수를 위해
클래스는 최대 3개 이하로 짠다.
어떠한 틀에 클래스를 입력하고 그 해당 클래스를 잡고, 개발을 할 경우 관리자페이지에서 내용을 바꿀 때 해당클래스가 없으면 바꾸지 못하게 되어 문제가 생길 수 있다.
ex).app .photo .line{text-align:center} --> 문서에 컨텐츠영역 맨위에 위치해 있으므로 .app이 없는 곳에선 사용하지 못함.
N-WAX (google 확장프로그램)
HTML Validator : HTML마크업 오류검출(google 확장프로그램)
CSS Validation Service : CSS 오류검출, url : https://css-validator.kldp.org/
오 유용한 정보 감사합니다!!