>웹 프론트엔드 >CSS 튜토리얼 >초보자가 꼭 읽어야 할 CSS 명명 규칙

초보자가 꼭 읽어야 할 CSS 명명 규칙

高洛峰
高洛峰원래의
2017-03-08 14:09:321612검색

아래 편집기에서는 CSS 명명 규칙에 대해 간략하게 설명합니다(초보자가 꼭 읽어야 할 내용). 편집자님이 꽤 좋다고 생각하셔서 지금 공유하고 모두에게 참고용으로 드리고자 합니다.

Head: header 
Content: content/container 
Tail: footer 
Navigation: nav 
Sidebar: sidebar
Column: columns
페이지 주변 장치 제어 전체 레이아웃 너비: 래퍼 
왼쪽 오른쪽 중앙 
로그인 바: 로그인바 
마크: 로고 
광고: 배너 
페이지 본문: 메인 :hot 
뉴스: 뉴스
다운로드: 다운로드 바닥글: footer
저작권: copyright
칼럼 제목: title
가입: Joinus
가이드: guild
서비스: service
등록: regsiter
상태: status
투표: vote
파트너: 파트너



댓글 작성 방법



/* 바닥글 */
컨텐츠 영역
/* 바닥글 끝 */


ID 명명

컨테이너: 컨테이너 헤더: 헤더 컨텐츠: 컨텐츠 /container

페이지 본문: 메인

페이지 테일: 바닥글
탐색: nav
사이드바: 사이드바

열: 열

페이지 주변 장치 제어 전체 레이아웃 너비: 래퍼 왼쪽 오른쪽 센터

ID 네이밍





페이지 구조

컨테이너: 컨테이너
헤더 :헤더 콘텐츠: 콘텐츠/컨테이너 페이지 본문: 메인 바닥글: 바닥글 탐색: nav

사이드바: 사이드바

열: 열 페이지 주변 장치 제어 전체 레이아웃 너비: 래퍼 왼쪽 오른쪽 가운데

Navigation



Navigation: nav
메인 탐색: mainbav
하위 탐색: subnav
상단 탐색: topnav
측면 탐색: 사이드바
왼쪽 탐색: 왼쪽 사이드바

오른쪽 탐색: 오른쪽 사이드바

메뉴: 메뉴 하위 메뉴: 하위 메뉴 제목 : 제목 요약 : 요약


기능


마크 : 로고
광고 : 배너
로그인 : 로그인
로그인바 :loginbar
등록 : regsiter
검색 : search
리본 : shop

제목 : title

가입 : Joinus 상태 : status 버튼 : btn 스크롤 : 스크롤 탭 페이지: 탭
글 목록: 목록
프롬프트 메시지: msg
현재: 현재
팁: 팁
아이콘: 아이콘
참고: 노트
가이드: 길드
서비스: 서비스
핫스팟: 핫
뉴스: 뉴스
다운로드: 다운로드
투표: 투표
파트너: 파트너
친절한 링크: 링크
저작권: copyright



클래스 이름 지정



(1) 색상: 색상 이름 또는 16진수 코드 사용(예:
.red { color: red; }
.f60 { color: #f60; }
.ff8600 { color: #ff8600; }

(2) 글꼴 크기는 "글꼴+글꼴 크기"로 직접 사용하세요.

.font12px {font-size: 12px }

.font9pt {font-size: 9pt; } 등의 이름 (3) 정렬 스타일은 정렬의 영문 이름을 사용하세요. 대상, .left { float:left }

.bottom { float:bottom }


(4) 제목 표시줄 스타일, "카테고리 + 함수" 방법 사용 이름을 지정하려면
.barnews { }
.barproduct { }



Notes

1. 모두 소문자입니다.
2. 가능한 한 영어를 사용하세요.

3. 대시나 밑줄을 넣지 마세요.

한 눈에 이해하기 쉬운 단어는 쓰지 마세요.
css
Module module.css

기본적으로 base.css 공유

layout,layout.css themes.css columns.css textfont.css forms.css

patch mend.css

Print print.css

위 내용은 편집자가 가져온 CSS 명명 규칙에 대한 간단한 토론(초보자가 꼭 읽어야 할 내용)의 전체 내용입니다. PHP 중국어 홈페이지를 지원해주세요~



위 내용은 초보자가 꼭 읽어야 할 CSS 명명 규칙의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.