웹 표준을 접한지는 꽤 되었지만, 실제로 실습을 시작한지는 얼마 되지 않았습니다. 오늘은 늑대 같은 초보자들과 코드 구조에 대한 통찰력을 공유하고 싶습니다. 이 글은 입문서입니다.
일부 친구들은 이 제목을 보고 약간 혼란스러워할 수 있으므로 Wolf가 모두에게 설명하도록 하세요.
먼저 Wolf가 DIV CSS의 품사를 형용사라고 생각하는 것에 대해 이야기해 보겠습니다. 그녀는 구조로 DIV(실제로는 XHTML)를 사용하고 프리젠테이션으로 CSS를 사용하는 웹 디자인 기술을 채택하는 방법을 설명했습니다. 중국에 웹 표준이 도입되었을 때 많은 사람들이 웹 표준 디자인의 사용을 누구나 쉽게 이해할 수 있도록 "DIV CSS"라고 설명했습니다. 그러나 문제도 나타났습니다. 웹 표준을 처음 접하는 많은 디자이너들은 원래 테이블 레이아웃을 대체하기 위해 DIV를 사용해야 한다고 생각합니다. 그들이 디자인한 웹페이지의 구조에는 DIV와 CSS도 포함되어 있습니다.
발생하는 오류는 그림과 같습니다. 모든 요소는 DIV 레이아웃을 채택합니다.
오류에 대한 간단한 분석으로 인해 많은 초보자는 레이아웃에 DIV를 완전히 사용하게 됩니다. 이러한 구조에서는 DIV2와 3에는 의미가 전혀 없습니다. 우리가 웹 표준을 채택하는 이유 중 하나는 코드 구조를 더욱 의미있게 만들기 위한 것입니다. 전문가들이 DIV를 무분별하게 사용하는 것은 테이블 레이아웃을 사용하는 것만큼 나쁘다고 했던 기억이 납니다.
실제로 코드를 이렇게 수정할 수 있습니다. 웹 페이지 구조를 더 좋게 만들어 보겠습니다.
여기서 DIV2와 3은 페이지 내용과 더 일치하는 h2와 p로 대체됩니다. 페이지의 코드 구조를 더 명확하고 의미있게 만듭니다.
나는 모든 사람들이 Wolf의 예를 통해 "DIV CSS는 실제로 DIV CSS가 아니다"라는 의미를 이해해야 한다고 믿습니다.