class와 id는 어떻게?
코딩을 처음 시작하기 할 때는 html의 태그에 id를 부여하고, css에서 코딩하는 것에 쉽게 빠진다.
id를 부여하면 태그를 지정하기 쉽기 때문이다.
수십 개 또는 수백 개의 div 중에 내가 원하는 하나만을 고를 수 있는 가장 편한 방법, 그것은 id를 부여하는 방법이기 때문이다.
하지만 코딩의 수준이 조금 올라가면 퍼블리싱에서 id를 함부로 사용하면 안된다는 것을 알게 된다.
개발에서 id를 사용해야 하는데 퍼블에서 그 id를 미리 사용하면?
코딩을 배우면 바로 알게 되는게 id는 절대로 겹쳐서 부여할 수 없다는 것, 하나의 html 파일에서는 id는 반드시 하나일 것이 규칙이다.
꼭 데이타베이스의 pk처럼.
사람이 사용하는 신분증이 겹치지 않고 꼭 하나인 것 처럼.
개발에서 꼭 사용해야 할 id를 퍼블에서 먼저 사용하게 되면? 개발에서 다른 id를 사용해야 할 것인가, 아니면 퍼블에서 id를 바꾸어야 할 것인가?
대답은 바로 정해진다. 퍼블에서 id를 바꾸어야 한다.
개발에서 id를 변경하기에는 번거로움과 어려움이 훨씬 많기 때문이다.
실무에서는 이러한 사실을 알기 때문에 퍼블에서는 아~~~주 특별한 경우가 아니면 id를 끌어다 사용하지 않는다.
그럼 퍼블에서는 어떻게 하나?
첫번째, 클래스를 부여하기.
클래스는 하나의 html 파일에서 수십 번, 수백 번을 부여해도 된다.
이 점은 공통된 스타일을 지정해 줄 때도 아주 편하다.
두번째, 부모의 부모에서 차례로 차례로 태그와 클래스를 부여해 오기.
세번째, 가상클래스 사용하기.
두번째와 세번째는 코딩을 잘하는 사람일 수록 많이 사용한다.
무분별한 클래스 사용도 방지하고, html도 많이 깔끔해진다.
코딩을 배우면서 늘 듣는 말은 html은 깔끔할 수록 좋다는 것이다.
그래서 두번째와 세번째에 익숙해지면 html이 점점 깔끔해진다.
네번째, 중복 클랙스 사용하기
단순하게 클랙스만으로도 지정하기 힘들고, 가상클래스로도 지정하기 힘들 때 중복 클래스를 사용하면 편하다.
하나의 클래스를 통해서 css에서 기본적인 속성, 공통적인 속성을 코딩해 주고, 중복 클래스로 별도의 개별 속성을 코딩할 때 많이 사용하는 방법이다.
퍼블에서는 되도록 class로 모든 작업을 해결하고, id는 개발에서 쓸 수 있게 배정을 한다는게 결론이다.
clsss도 꼭 필요한 것만 사용해서 html은 되도록 깔끔하게 유지를, 그래서 유지보수가 쉽게 하면 된다.
'프론트엔드 > HTML CSS' 카테고리의 다른 글
Can I use? 여기는 도대체 뭐하는 사이트일까? : 크로스브라우징 (0) | 2020.10.30 |
---|---|
html과 css의 기초는 MDN에서 배우세요. (0) | 2020.10.30 |
CSS 말줄임표(...)를 코딩하기 (0) | 2020.09.22 |
댓글