처음 CSS를 접했을 때 어디서부터 어떻게 시작해야 할지 몰라 헤맬 때가 많았습니다. 렌더링을 받은 후 많은 질문이 우리를 괴롭혔습니다. 어떻게 배치할 것인가? 절대 위치 또는 상대 위치, 어떤 태그를 선택해야 할까요? 채택할 구조. .등. 물론, 코드를 작성하는 과정에서 우리는 많은 문제에 직면하게 될 것입니다. 특히 모든 측면에 익숙하지 않고 경험이 부족한 우리 초보자는 문제에 직면할 때 종종 당황하게 됩니다. 문제가 발생하면 다음에 같은 실수를 저지르지 않도록 문제를 요약하는 방법을 배워야 한다고 생각합니다.
다음은 내 작업에서 요약한 몇 가지 일반적인 실수입니다.
및 솔루션 팁이 CSS 초보자에게 도움이 되기를 바랍니다.
1. HTML 요소에 철자 오류가 있는지, 태그를 닫는 것을 잊었는지 확인하세요.
최고의 전문가라도 그런 실수를 저지르게 됩니다. 페이지 구조가 매우 복잡하고 여러 레이어에 중첩되어 있으면 닫는 태그를 잃기 쉽기 때문입니다. 특히 나처럼 메모장에 글을 쓰는 데 익숙한 사람들은 실수할 확률이 더 높다. 그러니 글을 쓸 때 조심하세요.
2. CSS가 올바른지 확인하세요
일반적으로 CSS에서 가장 흔한 오류는 스타일과 HTML의 속성 이름이 일치하지 않는다는 것입니다. 결과적으로 스타일은 분명하게 쓰여졌으나 아무런 효과가 없습니다.
3. 배경을 사용하여 해당 레이어를 찾습니다.
오류를 디버깅할 때, 특히 브라우저 호환성을 디버깅할 때 중첩된 레이어가 많아 정렬이 잘못되거나 겹치기 쉽습니다. 이때 차이점을 보여주기 위해 키 레이어에 배경색을 추가합니다. 이는 오류를 제거하는 데 도움이 됩니다.
4. 제거 방법에 따라 오류 위치를 결정합니다.
CSS 코딩을 작성할 때 보통 약간의 작업을 한 후 미리보기를 하는데, 이때 오류가 발생하면 새로 추가된 레이어를 정상적으로 표시될 때까지 삭제하여 문제가 있는 레이어를 파악하면 됩니다.
5. float 요소는 width 속성을 지정해야 합니다.
너비가 지정되지 않은 부동 소수점 요소를 표시할 때 많은 브라우저에 버그가 있습니다. 따라서 float 요소의 내용에 관계없이 width 속성을 지정해야 합니다.
6. 중복된 스타일 제거
우리는 공개 스타일을 처음에 선언하고 아래에 작성할 때 잊어버리는 경우가 많습니다. 예를 들어 처음에 img{border:none;}을 선언했습니다.
그러다가 img 태그를 만났을 때 다시 썼습니다. 이런 상황은 피해야 합니다.
7. 인코딩 형식에 주의하세요
일반적인 상황에서 우리가 사용하는 인코딩 형식은 gb2312 및 UTF8입니다. 좋은 것과 나쁜 것의 구별은 없습니다. 그러나 혼합하지 마십시오. 많은 편집자는 기본적으로 UTF8 형식을 사용합니다.
8. 링크 스타일 작성 순서
많은 분들이 링크 스타일을 작성하신 후, 클릭 후의 색상이 원하는 색상이 아닐 경우, 링크 스타일이 작성되는 순서를 확인하셔야 합니다. 올바른 쓰기 순서는 LVHA여야 합니다.