프론트엔드/HTML CSS4 class와 id는 누가 어떻게 사용하면 좋을까? class와 id는 어떻게? 코딩을 처음 시작하기 할 때는 html의 태그에 id를 부여하고, css에서 코딩하는 것에 쉽게 빠진다. id를 부여하면 태그를 지정하기 쉽기 때문이다. 수십 개 또는 수백 개의 div 중에 내가 원하는 하나만을 고를 수 있는 가장 편한 방법, 그것은 id를 부여하는 방법이기 때문이다. 하지만 코딩의 수준이 조금 올라가면 퍼블리싱에서 id를 함부로 사용하면 안된다는 것을 알게 된다. 개발에서 id를 사용해야 하는데 퍼블에서 그 id를 미리 사용하면? 코딩을 배우면 바로 알게 되는게 id는 절대로 겹쳐서 부여할 수 없다는 것, 하나의 html 파일에서는 id는 반드시 하나일 것이 규칙이다. 꼭 데이타베이스의 pk처럼. 사람이 사용하는 신분증이 겹치지 않고 꼭 하나인 것 처럼. .. 2020. 11. 29. Can I use? 여기는 도대체 뭐하는 사이트일까? : 크로스브라우징 크로스브라우징 준비하기 : Can I use 프론트엔드 개발을 공부하거나 웹퍼블리셔를 공부하는 사람이라면 크로스브라우징을 모두 한 번 이상은 들어보게 된다. 크로스브라우징이란? 웹사이트를 제작을 하게 되면 다양한 html과 css를 사용하게 된다. 그런데 브라우저에 따라 html과 css를 받아들일 수 있는게 달라진다. 그래서 소스가 같아도 브라우저에 따라 모니터에서 보이는 효과가 달라질 수 있다. 이러한 것을 미리 확인해 볼 수 있는 사이트가 있어 이번에 소개한다. 사이트 이름은 "캔 아이 유즈"이다. caniuse.com/ Can I use... Support tables for HTML5, CSS3, etc caniuse.com 홈페이지의 화면은 아래와 같다. 영어로 된 사이트이기 때문에 검색도 영.. 2020. 10. 30. html과 css의 기초는 MDN에서 배우세요. MDN을 소개합니다. HTML과 CSS를 배우면서 첫 발을 내딛을 때 제일 많이 들었던 사이트는 MDN과 W3C school입니다. 그중에 MDN 사이트를 먼저 소개합니다. MDN 사이트는 기본적으로 영어로 콘텐츠가 구성되어 있으나 한국어 안내도 지원해 주고 있습니다. developer.mozilla.org/ko/ MDN Web Docs MDN 웹 문서 사이트는 HTML, CSS, 및 웹 사이트와 프로그레시브 웹 앱을 위한 API를 포함한 오픈 웹 기술에 대한 정보를 제공합니다. 또한 Firefox 개발자 도구와 같은 Mozilla 제품을 위한 개발자 지향 문 developer.mozilla.org 시간이 있을 때는 사이트를 방문해서 메뉴 카테고리에서 Html, CSS, Javascript 등 자신이 필.. 2020. 10. 30. CSS 말줄임표(...)를 코딩하기 게시판에서 말줄임표를 CSS에서 코딩하기 메인페이지에 노출되는 뉴스의 요약내용에 보이는 말줄임표 (...)를 CSS에서 아래와 같이 코딩하세요. 영역에서 벗어나는 글자들은 "..." 표시해 줍니다. 간단하지만 코딩으로 표현하기에는 한편으로 어렵기도 해서 정리해 보았습니다. { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } 2020. 9. 22. 이전 1 다음