DIV+CSS 표준 명명된 컬렉션
- 巴扎黑원래의
- 2017-05-01 14:51:211548검색
CSS+p 웹페이지(Xhtml)를 개발할 때 가장 헷갈리고 얽히는 것은 CSS 이름 지정입니다. 특히 초보자들은 장소 이름을 어떻게 지정해야 하는지, 어떻게 지정하는 것이 가장 좋은지 모릅니다.
명명 규칙 설명:
1) 이름은 모두 소문자여야 합니다
2) 속성 값은 큰따옴표("")로 묶어야 하며, class="pcss5", id="pcss5"
와 같은 값을 가져야 합니다. 3) 각 라벨에는 시작과 끝이 있어야 하며 수준이 정확해야 하며 레이아웃이 규칙적이고 깔끔해야 합니다
4) 빈 요소에는 종료 태그가 있거나 시작 태그 뒤에 "/"
를 추가해야 합니다. 5) 성능과 구조는 완전히 분리됩니다. 코드에는 스타일, 글꼴, bgColor, 테두리 등 성능 요소가 포함되지 않습니다.
6) 정의는 큰 것부터 작은 것까지 원칙을 따라야 하며 문서의 구조를 반영하고 검색 엔진 쿼리를 용이하게 해야 합니다.
7) 각 테이블과 양식에 고유한 구조 태그 ID
를 추가합니다. 8) 사진에 Alt 태그 추가
9) 영어 작명 원칙을 사용해 보세요
10) 한눈에 이해하기 쉬운 단어가 아니면 축약하지 마세요
웹페이지 외부 레이어의 중요한 부분에 대한 CSS 스타일 명명 기준:
코트 랩----가장 바깥쪽 헤더 헤더에 사용---헤더 메인의 주요 내용에 사용 ------------메인 콘텐츠(중간)에 사용됨 왼쪽 메인-왼쪽---------------왼쪽 레이아웃 오른쪽 메인-오른쪽------ ---- ---오른쪽 레이아웃 탐색 모음 탐색------웹 페이지 메뉴 탐색 막대 내용--------------- -하단에 사용됩니다. 웹페이지 중간 본문 바닥글------하단에 사용
p+CSS 명명 참조표:
다음은 CSS 스타일 명명 및 CSS 파일 명명, p CSS 명명 모음에 대한 참조표입니다.
CSS 스타일 명명 |
설명 |
|
웹페이지의 공개 이름 지정 |
|
|
#래퍼 |
페이지 주변은 전체 레이아웃 너비를 제어합니다 |
|
#컨테이너 또는 #콘텐츠 |
가장 바깥층에 사용되는 용기 |
|
#레이아웃 |
레이아웃 |
|
#머리,#헤더 |
헤더 부분 |
|
#발,#바닥글 |
바닥글 섹션 |
|
#nav |
메인 네비게이션 |
|
#하위 탐색 |
보조 탐색 |
|
#메뉴 |
메뉴 |
|
#하위메뉴 |
하위메뉴 |
|
#사이드바 |
사이드바 |
|
#sidebar_a,#sidebar_b |
왼쪽 열 또는 오른쪽 열 |
|
#메인 |
페이지 본문 |
|
#태그 |
태그 |
|
#msg #메시지 |
프롬프트 메시지 |
|
#팁 |
팁 |
|
#투표 |
투표 |
|
#친구링크 |
친근한 인연 |
|
#제목 |
제목 |
|
#요약 |
요약 |
|
#로그인바 |
로그인바 |
|
#검색입력 |
검색 입력창 |
|
#핫 |
인기 핫스팟 |
|
#검색 |
검색 |
|
#검색_출력 |
검색 결과는 검색 결과와 유사합니다 |
|
#검색바 |
검색창 |
|
#검색결과 |
검색결과 |
|
#저작권 |
저작권 정보 |
|
#브랜딩 |
상표 |
|
#로고 |
홈페이지 로고 |
|
#사이트정보 |
홈페이지 정보 |
|
#siteinfo법적 |
법적 고지 |
|
#siteinfo크레딧 |
평판 |
|
#조이너스 |
우리와 함께하세요 |
|
#파트너 |
파트너 |
|
#서비스 |
서비스 |
|
#등록자 |
등록 |
|
도착/화살표 |
화살표 |
|
#길드 |
안내 |
|
#사이트맵 |
사이트맵 |
|
#목록 |
목록 |
|
#홈페이지 |
홈 |
|
#하위페이지 |
보조 페이지 하위 페이지 |
|
#도구,#툴바 |
툴바 |
|
#드롭 |
드롭다운 |
|
#기숙사메뉴 |
드롭다운 메뉴 |
|
#상태 |
현황 |
|
#스크롤 |
스크롤 |
|
.탭 |
태그 페이지 |
|
.left.right.center |
왼쪽, 중앙, 오른쪽 |
|
.뉴스 |
뉴스 |
|
.다운로드 |
다운로드 |
|
.배너 |
광고배너(상위광고배너) |
|
전자상거래 관련 |
|
|
.제품 |
제품 |
|
.제품_가격 |
상품가격 |
|
.제품_설명 |
제품설명 |
|
.제품_리뷰 |
상품평 |
|
.editor_review |
댓글 수정 |
|
.news_release |
최신상품 |
|
.출판사 |
제조사 |
|
.스크린샷 |
썸네일 |
|
.faq |
자주 묻는 질문 |
|
.키워드 |
키워드 |
|
.블로그 |
블로그 |
|
.포럼 |
포럼 |
CSS 문서 이름 |
설명 |
||||||||||||||||||||||
|
정말 대단해요 | ||||||||||||||||||||||
| module.css | 模块 | ||||||||||||||||||||||
| base.css | 基本共용 | ||||||||||||||||||||||
| layout.css | 布局，版면 | ||||||||||||||||||||||
| themes.css | 주인님 | ||||||||||||||||||||||
| columns.css | 专栏 | ||||||||||||||||||||||
| font.css | 문자, 문자 | ||||||||||||||||||||||
| forms.css | 表单 | ||||||||||||||||||||||
| mend.css | ㅋㅋㅋ | ||||||||||||||||||||||
| print.css | 打印 |
위 내용은 DIV+CSS 표준 명명된 컬렉션의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!