html 페이지의 CSS 및 DIV 명명 규칙
CSS 명명 규칙
헤더: 헤더
콘텐츠: 콘텐츠/포함
꼬리: 바닥글
내비게이션: 네비게이션
사이드바: 사이드바
열: 열
페이지 주변 제어 전체 레이아웃 너비: 래퍼
왼쪽 오른쪽 중앙 : 왼쪽 오른쪽 중앙
로그인바: 로그인바
로고 : 로고
광고: 배너
페이지 본문: 메인
핫스팟: 핫
뉴스: 뉴스
다운로드: 다운로드
하위 탐색: subnav
메뉴: 메뉴
하위 메뉴: 하위 메뉴
검색: 검색
친절한 링크:friendlink
바닥글: 바닥글
저작권: copyright
스크롤: 스크롤
내용: 내용
탭 페이지: 탭
기사 목록: 목록
프롬프트 메시지: msg
팁:팁
칼럼 제목: title
가입: Joinus
안내 : 길드
서비스: 서비스
등록: regsiter
상태: 상태
투표:투표
파트너:파트너
XHTML 파일의 ID 이름 지정
(1) 페이지 구조
컨테이너: 컨테이너
페이지 머리글: 헤더
콘텐츠: 콘텐츠/컨테이너
페이지 본문: 메인
바닥글: 바닥글
내비게이션: 네비게이션
사이드바: 사이드바
열: 열
페이지 주변 제어 전체 레이아웃 너비: 래퍼
왼쪽 오른쪽 중앙 : 왼쪽 오른쪽 중앙
(2)내비게이션
내비게이션: 네비게이션
메인 네비게이션: mainbav
하위 탐색: subnav
상단 탐색: 상단 탐색
측면 탐색: 사이드바
왼쪽 탐색: 왼쪽 사이드바
오른쪽 탐색: 오른쪽 사이드바
메뉴: 메뉴
하위 메뉴: 하위 메뉴
제목 : title
요약: 요약
(3) 기능
로고 : 로고
광고: 배너
로그인: 로그인
로그인바: 로그인바
등록: regsiter
검색: 검색
리본 : 쇼핑
제목 : title
가입: Joinus
상태: 상태
버튼: btn
스크롤: 스크롤
탭 페이지: 탭
기사 목록: 목록
프롬프트 메시지: msg
현재: 현재
팁:팁
아이콘: 아이콘
참고: 참고
안내 : 길드
서비스: 서비스
핫스팟: 핫
뉴스: 뉴스
다운로드: 다운로드
투표:투표
파트너:파트너
친절한 링크: 링크
저작권: copyright
CSS+DIV 명명 규칙:
로그인 바: loginBar
로고 : 로고
사이드바: sideBar
광고: 배너
내비게이션:nav
하위 탐색: subNav
메뉴:메뉴
하위 메뉴: 하위 메뉴
검색: 검색
스크롤:스크롤
페이지 본문: 메인
내용:내용
탭 페이지:tab
기사 목록: 목록
프롬프트 메시지: msg
팁:팁
칼럼 제목: title
친절한 링크: friendLink
바닥글: 바닥글
가입: Joinus
안내:길드
서비스: 서비스
핫스팟: 핫
뉴스: 뉴스
다운로드:다운로드
등록:등록
상태: 상태
버튼:btn
투표:투표
파트너:파트너
저작권: copyRight
1. CSSID의 명명
코트:랩
기본 탐색:mainNav
하위 탐색: subnav
바닥글: 바닥글
전체 페이지: 내용
헤더: 헤더
바닥글: 바닥글
상표: 라벨
제목:제목
메인 네비게이션: mainNav(globalNav)
상단 탐색: 상단 탐색
측면 탐색: 사이드바
왼쪽 탐색: leftsideBar
오른쪽 탐색: rightsideBar
깃발: 로고
슬로건: 배너
메뉴 콘텐츠 1:menu1Content
메뉴 용량: menuContainer
하위 메뉴: 하위 메뉴
측면 탐색 아이콘: sidebarIcon
참고: 참고
이동 경로: breadCrumb(예: 페이지 위치에 대한 탐색 프롬프트)
컨테이너:컨테이너
내용:내용
검색: 검색
로그인: 로그인
기능 영역 : 매장(장바구니, 계산원 등)
현재 전류
2. 스타일 파일 이름 지정
메인: master.css
레이아웃:layout.css
열: columns.css
텍스트:font.css
인쇄 스타일: print.css
테마:themes.css
참고: 이들은 모두 클래스이므로 확장해야 하며, 현재 이름에 "_"(밑줄) 접미사를 사용하여 이름을 사용자 정의해야 합니다.
나는 목록 페이지를 list, 뉴스 목록을 newslist, 사진 목록을 piclist라고 부르는 데 익숙합니다.
컨텐츠 페이지는 보기
/**/
전체적으로 큰 프레임: #wrapper
큰 틀 속 : #inwrapper
///////////////////////////////////////////// /// ////////////////////////////////////////////// /////// ////////
상단 및 배너: .top
상단 및 배너 내: .intop
로고:.logo
배너:.banner
탐색: .menu
탐색: .inmenu
.메뉴
.메뉴얼 리
.Menuul li a
드롭다운 메뉴: .inmenu_xiala
.Inmenu_xialaul
.Inmenu_xialaul 리
.Inmenu_xialaul 리아
///////////////////////////////////////////// /// ////////////////////////////////////////////// /////// //////////
주요 콘텐츠: .mainWrapper
주요 콘텐츠: .inmainwrapper
왼쪽 블록: .sideleft
왼쪽 내부: .insideleft
오른쪽 열: .sideright
오른쪽 안쪽: .insideright
센터: .sidecenter
센터 내부: .insidecenter
///////////////////////////////////////////// /// ////////////////////////////////////////////// /////// ////////////
하단: .foot
하단 안쪽 : .infoot
///////////////////////////////////////////// /// ////////////////////////////////////////////// /////// //////////
/*기타 명명*/
검색: .search
검색: .insearch
검색창: .searchselect
검색 버튼: .serachbuttom
입력 텍스트 상자: .input
.선택
/*테이블 스타일*/
테이블의 전체 프레임: .listbox
테이블 너비: .listbox-table
테이블 헤더 텍스트 스타일: .listbox-header
테이블 텍스트 스타일: .listbox-entry
/*범용형*/
일반: .GM/*이건 좀 우울하네요. 제 영어가 너무 서툴거든요...*/
일반: .INGM
일반 왼쪽 부동소수점: .GMfl(GM FLOAT LEFT)
일반 오른쪽 부동소수점: .GMfr(GM FLOAT RIGHT)
/*범용적인 사진 스타일*/
범용 이미지 스타일: .img
/*플로트 지우기*/
모든 플로트 지우기: .clear
왼쪽 부동 소수점 지우기: .clearleft
오른쪽 플로트 지우기: .clearright
/*텍스트 스타일*/
텍스트: .font
/*뉴스 목록*/
뉴스 목록: .fontnews
/*페이지 글꼴 스타일 보기*/
페이지 보기 글꼴: .fontview
상표: 라벨
제목: 제목
메인 네비게이션 : mainbav (globalnav)
상단 탐색: 상단 탐색
사이드 탐색: 사이드바
왼쪽 탐색: 왼쪽 사이드바
오른쪽 탐색: 오른쪽 사이드바
깃발: 로고
슬로건: 배너
메뉴 콘텐츠 1: 메뉴 1 콘텐츠
메뉴 용량: 메뉴 컨테이너
하위 메뉴: 하위 메뉴
사이드 탐색 아이콘: sidebarIcon
참고: 참고
탐색경로: 탐색경로(예: 페이지 위치에 대한 탐색 프롬프트)
컨테이너: 컨테이너
내용: 내용
검색: 검색
로그인: 로그인
기능 영역: 매장(장바구니, 계산원 등)
현재 전류
마스트헤드: 마스트헤드
초록, 요약요약 또는 일반
왼쪽 사진 왼쪽에 떠있는 사진
오른쪽 사진 오른쪽에 떠있는 이미지
제목 제목
항목 하단 항목하단
추가 확장 또는 .more
컨테이너 배경 컨테이너bg
서비스 서비스
서비스링크 서비스링크
라인라인
텍스트 텍스트
오른쪽
저작권 저작권
뉴스 뉴스
책 표지 포장지
소개 소개-1부
컬럼 컬럼
진로 진로
섹션 섹션
모듈 모듈
상위 탐색 하위 탐색
2. 또한 스타일 시트 편집 시 표시되는 코멘트는 다음과 같이 작성할 수 있습니다.
<-- 바닥글 -->
콘텐츠 영역
<-- 바닥글 끝 -->
3. 스타일 파일 이름 지정
메인 master.css
레이아웃,layout.css
열 columns.css
텍스트 글꼴.css
인쇄 스타일 print.css
테마 theme.css
4. 스타일 시트의 댓글
예시 1
/* 글로벌 -------------- */
/* 링크 -------------- */
/* 양식 ---------------------------- */
/* IDS -------------------------- */
/* 헤더 ---------------------------- */
/* 열 1 -------------- */
/* 열 2 -------------- */
/* 클래스 ---------------------------- */
예시 2
HTML
예 3(NetEase)
CSS
#Urs로그인
#로고내비
#칼럼
#콘텐츠1
#bNav
#저작권
#Urs로그인
#로고내비
#검색지역
#채널영역
#핫뉴스
#뉴스센터
.키워드
#쇼핑지역
#도시
#회사소개
……………
공통 명칭
포장지와 용기가 들어있습니다.
헤더 또는 약어로 hd
바닥글 또는 약어로 ft
내비게이션 네비게이션
내 위치 탐색경로
보조 탐색 sub_nav
사이드바 사이드바 또는 사이드 열
모듈 모듈
데이터베이스의 명명 규칙
데이터베이스에는 문자 규칙이 포함됩니다
영문 26자(대소문자 구분)와 0~9까지의 10개의 자연수와 밑줄_을 더해 총 63자로 구성됩니다. 다른 문자(설명 제외)는 나타날 수 없습니다.
데이터베이스 객체 명명 규칙
데이터베이스 개체에는 테이블, 뷰(쿼리), 저장 프로시저(매개변수 쿼리), 함수 및 제약 조건이 포함됩니다. 객체 이름은 접두사와 실제 이름으로 구성되며, 길이는 30자를 초과할 수 없습니다. 접두사: 소문자를 사용합니다.
예: 테이블-tb 보기-vi 저장 프로시저-sp 함수-fn
실명
실제 이름은 엔터티의 내용을 설명하기 위한 것이며 단어 또는 단어의 조합으로 구성됩니다. 각 단어의 첫 글자는 대문자로 표시되며 그 외의 글자는 숫자나 _로 시작하지 않습니다.
예: 테이블 User_Info 보기 UserList 저장 프로시저 UserDelete
따라서 법적 개체 이름은 다음과 유사합니다.
테이블 tbUser_Info, tbMessage_Detail
vi_MessageList 보기
저장 프로시저 sp_MessageAdd
데이터베이스 테이블 명명 규칙
필드는 접두어와 실제 이름으로 구성됩니다. 시스템에서는 실제 이름의 첫 번째 단어와 동일한 단어를 사용하려고 합니다.
접두사: 소문자 tb를 사용하여 테이블을 나타냅니다.
예: tbMember tbMember_Info tbForum_Board tbForum_Thread1
필드 명명 규칙
숫자, 문자, 날짜/시간, lob(대형 개체), 기타, 필드는 표의 약어, 밑줄, 실제 이름과 접미사로 구성됩니다.
접미사: 소문자를 사용하여 필드의 속성을 나타냅니다.
예: User_Idint User_Namestr User_RegDatedtm
명명 규칙 보기
필드는 밑줄로 연결된 접두사와 실제 이름으로 구성됩니다.
접두사: 소문자 vi를 사용하여 뷰를 나타냅니다.
예: vi_User vi_UserInfo
저장 프로시저 명명 규칙
필드는 밑줄로 연결된 접두사와 실제 이름으로 구성됩니다.
접두사: 소문자 sp를 사용하여 저장 프로시저를 나타냅니다.
예: sp_User
데이터베이스 설계 문서 규칙
모든 데이터베이스 디자인은 문서로 작성되어야 하며, 문서는 모듈 형식으로 표현되어야 합니다. 일반적인 형식은 다음과 같습니다.
'----------------------------------
테이블 이름 : tbUser_Info
작성자: UAM_Richard
' 날짜: 2004-12-17
' 버전: 1.0
설명: 사용자 정보 저장
구체적인 내용:
UserId int, 자동 증가 사용자 코드
사용자 이름 문자(12) 사용자 이름
......
---------------------------------- ---
CSS 클래스 및 ID의 명명 규칙
웹 개발자는 CSS 클래스와 ID 이름을 만들고 이러한 이름을 사용하여 div 및 기타 형식의 페이지 요소를 식별할 수 있습니다. 개발자의 경우 XHTML 태그(태그)를 재정의하는 CSS 선택기의 이름을 지정할 때 미리 정의된 태그와 정확하게 일치하는지 확인해야 하지만 클래스 및 ID 선택기 이름에 관해서는 의견의 문제입니다. 그러나 이러한 클래스와 ID의 이름을 원하는 대로 지정하는 것은 좋은 습관이 아닙니다.
1. 직관적인 네이밍
웹페이지를 디자인하고 div를 식별해야 할 때 가장 자연스러운 아이디어는 페이지에서 요소의 위치를 설명할 수 있는 단어를 사용하여 이름을 지정하는 것입니다.
예: 상단 패널
가로 탐색
왼쪽
중앙 열
오른쪽 열
CSS, XHTML 클래스 및 ID에 대한 유효한 명명 규칙입니다. 이러한 용어는 간단하고 설명적이므로 페이지 요소와 해당 CSS 스타일을 식별해야 하는 요구 사항을 충족합니다.
그런데 문제는 그러한 이름이 페이지 내용의 특정 표현과 연관되어 있다는 것입니다. 이러한 이름은 특정 페이지 레이아웃 내에서 페이지 요소의 위치를 나타내므로 해당 레이아웃 외부에서 사용하는 것은 부적절하거나 혼란스러울 수도 있습니다. 이러한 이름은 문서 내용의 구조에 대한 참조가 없습니다. 따라서 CSS 클래스와 ID의 이름을 지정하는 더 좋은 방법이 있습니다.
2. 구조화된 네이밍
CSS, XHTML 클래스 및 ID에 대한 유효한 명명 규칙입니다. 이러한 용어는 간단하고 설명적이므로 페이지 요소와 해당 CSS 스타일을 식별해야 하는 요구 사항을 충족합니다. 이는 CSS 및 XHTML 클래스와 ID의 이름을 지정하는 유효한 방법입니다. 이러한 용어는 간단하고 설명적이므로 페이지 요소와 해당 CSS 스타일을 식별해야 하는 요구 사항을 충족합니다.
태그된 관련 정보는 문서의 모양보다는 문서의 구조를 설명하는 데 사용됩니다. 이 기능을 사용하면 CSS를 간단히 변경하여 다양한 모양 형식으로 콘텐츠와 마크업을 재사용할 수 있습니다. 이 방법을 이해하면 오디오와 같은 표시 형식을 처리할 때 페이지 위치를 사용하여 클래스 및 ID 이름을 지정하는 것이 매우 부적절하다는 것을 쉽게 알 수 있습니다. 따라서 클래스와 ID는 나타나는 위치보다는 문서에서의 사용 목적에 따라 구조화되어야 합니다.
아래와 같이 구조화된 방식으로 클래스 및 ID 이름을 지정할 수 있습니다.
예: 브랜딩
메인네비
하위 탐색
주요내용
사이드바
이러한 이름은 직관적인 이름 지정만큼 이해하기 쉽지만 위치보다는 페이지 요소의 역할을 설명합니다. 이는 순수한 구조적 마크업을 사용하려는 원래 의도와 코드의 일관성을 더욱 높여줍니다. 즉, 개발자는 마크업을 변경하지 않고도 다양한 미디어의 표시 형식을 처리할 수 있습니다.
다른 미디어로 웹 페이지 형식을 지정할 계획이 없더라도 구조화된 이름 지정을 사용하면 향후 사이트 업그레이드나 재설계를 더 쉽게 만드는 데 도움이 될 수 있습니다. 예를 들어, 구조화된 이름 지정은 동일한 ID 오른쪽 열을 가진 div가 페이지 왼쪽으로 이동할 때 혼란을 방지합니다. 페이지의 어느 쪽에 표시되든 이름은 여전히 직관적이고 개발자가 이해하기 쉽기 때문에 이런 방식으로 div 사이드바의 이름을 지정하는 것이 더 적절합니다.
3. 컨벤션
Andy Clarke는 표준화된 웹 디자인 개념을 옹호하는 개발자가 디자인한 40개의 웹 사이트의 소스 코드를 분석했습니다. 클래스 이름과 ID 이름은 매우 불일치하지만 자주 나타나는 일부 공통 이름은 여전히 발견됩니다. 가장 일반적으로 사용되는 클래스/ID 이름의 예 목록은 다음과 같습니다.
예: 헤더
내용
탐색
사이드바
바닥글
3. 회원별 명명 규칙
회원별 명명 규칙은 파일과 폴더를 소속에 따라 분류하여 명명하는 것을 말하며, 이를 통해 파일 배열을 보다 논리적으로 만들 수 있습니다.
예를 들어, 마우스 클릭 전의 사진 파일은 "file_on"이고 클릭한 후의 사진 파일 이름은 이 범주에 따라 "file_off"로 지정됩니다.
4. 속성 기반 명명 규칙
예: 작은 장식 그림은 "___.*"에 따라 표현됩니다. 이것은 "heart_red_401*334_1.jpg"입니다.
5. 서수 기반 명명 규칙
웹 페이지에서는 이미지 다운로드 시간을 줄이기 위해 일반적으로 이미지를 작은 부분으로 나누어 전체 이미지를 구성합니다. 이 경우 이름을 지정하는 데 2차원 배열을 사용할 수 있습니다.
예:
이 사진은 "donghua_11.jpg" 입니다
이 사진은 "donghua_12.jpg"입니다
이 사진은 "donghua_21.jpg"입니다
이 사진은 "donghua_22.jpg"입니다
이것이 그림을 형성합니다.
6. 열거 기반 명명 규칙
첫 번째는 책 옆면에 있는 "ddd_cemian.jpg"입니다
두 번째는 책 표지 "ddd_fengpi.jpg"입니다
세 번째는 책 뒷표지에 있는 "ddd_fengdi.jpg"입니다
일부 웹사이트에서는 사진 보기 크기가 다양하므로 사용자가 원하는 대로 볼 수 있습니다.
예: "ddd_cemian_401*334.jpg" 및 "ddd_cemian_1024*768.jpg"
웹사이트 구축 시 참고사항입니다.
코드 충돌을 방지하고 코드를 더욱 다양하게 만들려면 명명 규칙을 사용하는 것이 좋은 프로그래밍 습관입니다. 좋습니다. 일반적으로 사용되는 몇 가지 규칙은 다음과 같습니다.
◆명명된 변수, 메소드 및 속성
변수, 메소드, 속성 이름의 첫 글자는 대문자로 표기해야 하며 이름은 목적(또는 의미)을 표현해야 합니다.
변수
.NET 명명
헝가리식 명명
설명
C스트링
직원 이름
sz이름
직원 이름.
인트
출석 카운터
n카운터
long형 카운터입니다.
오래
바이트 수
l바이트
Long형 변수는 바이트를 저장합니다.
때때로 정의에 밑줄 "_"을 사용하는 데 익숙합니다(예: Add_Data(int a, int b)). 새로운 명명 규칙에 따르면 이는 잘못된 것은 아니지만 좋은 프로그래밍 습관이 아닙니다. Add_Data의 정의를 AddData로 변경해야 합니다. 이는 Microsoft 표준이 아니므로 이러한 규칙을 따를 필요는 없습니다. 그러나 어떤 곳에서는 아래에서 이러한 법률의 이론적 근거를 이해하게 될 것입니다.
개인적으로는 헝가리식 명명법을 선호합니다. 물론 변수에도 동일한 규칙이 적용됩니다. 헝가리어 명명법을 기억한다면 부울 변수 정의는 다음과 같이 "b"로 시작합니다.
BOOL bFlag = TRUE;
새 규칙에서는 플래그 및 "b" 사용을 더 이상 사용하지 않습니다.
bool IsFileFound = true;
새로운 규칙에 대한 추가 지침이 있는 MSDN을 검색할 수 있습니다.
◆명명된 구성 요소 및 컬렉션(어셈블리)
코드 충돌을 방지하려면 명명 규칙에 따라 라이브러리(.NET에서는 어셈블리라고 함)의 이름을 지정하는 것이 좋은 프로그래밍 습관입니다. 귀하가 MindCracker 회사에 근무하고 있으며 C# 데이터베이스 클래스를 확장하기 위한 라이브러리를 개발 중이라고 가정해 보겠습니다. MyAssembly.Database.ADOSet보다 이름을 MindCracker.DatabaseAssembly.ADOSet으로 지정하는 것이 훨씬 좋습니다.
라이브러리에 테이블에서 데이터를 읽고 데이터 세트를 반환하는 메서드가 있다고 다시 가정해 보겠습니다. DataSet return_data()로 이름을 지정한 경우 DataSet ReturnData()로 변경합니다.
또한 이름을 지정할 때 일관된 단어 순서를 따라야 합니다. 예를 들어 Employee와 Manager라는 두 개의 테이블이 있고 테이블 각각에 대해 테이블에 레코드를 삽입하는 메서드를 정의하는 경우 AppendEmployee 및 AppendManager라는 메서드 이름이 AppendEmployee 및 ManagerAppend보다 낫습니다.
저는 블록 구조와 중첩 블록 구조를 이해하기 쉽기 때문에 두 가지 방법을 선호합니다.
◆헝가리 명칭(efoxxx 첨부)
헝가리 명명법은 Microsoft에서 오랫동안 근무한 헝가리 프로그래머가 고안했습니다. 이 명명법은 다양한 Microsoft 제품 및 문서를 통해 확산됩니다. 대부분의 숙련된 프로그래머는 어떤 언어를 사용하든 어느 정도는 사용합니다
이 명명법의 기본 원칙은 다음과 같습니다.
변수 이름 = 속성 + 유형 + 개체 설명
즉, 변수 이름은 세 부분의 정보로 구성됩니다. 이렇게 하면 프로그래머는 변수의 유형과 목적을 쉽게 이해할 수 있고, 기억하기도 쉽습니다.
다음은 권장 규칙의 예입니다. 선택하여 사용하거나 개인 취향에 따라 수정할 수 있습니다.
⑴속성 부분:
전역 변수: g_
상수: c_
클래스 멤버 변수: m_
⑵유형 부분:
포인터: p
핸들: h
부울 유형: b
부동 소수점 유형: f
서명 없음: u
⑶설명부분 :
초기화: Init
임시변수: Tmp
대상 객체: Dst
소스 객체: Src
창: Wnd
헝가리 명명법을 소개하고 다음 예에서는 이 명명법과 위의 코딩 스타일을 고수하려고 노력할 것입니다. 다시 말하지만 모든 독자가 이를 준수해야 하는 것은 아니지만 현대 소프트웨어 개발자인 독자는 이를 준수하기를 바랍니다.
배열 배열
b BOOL(int) 부울(정수)
Unsigned Char(바이트)별 Unsigned Char(바이트)
c 문자(바이트)
cb 바이트 수 바이트 수
cr 색상 기준 값 색상(기준) 값
cx x의 개수(Short) x의 집합(Short 정수)
dw DWORD(부호 없는 긴) 더블 워드(부호 없는 긴 정수)
f 플래그(일반적으로 여러 비트 값) 플래그(일반적으로 여러 비트 값)
fn 기능
g_글로벌
h 핸들 핸들
i 정수 정수
l Long Long 정수
lp 긴 포인터 긴 포인터
m_ 클래스의 데이터 멤버 클래스의 데이터 멤버
n Short int Short 정수
p 포인터 포인터
의 문자열
sz 0으로 끝나는 문자열 0으로 끝나는 문자열
tm 텍스트 측정항목 텍스트 규칙
u Unsigned int 부호 없는 정수
ul 부호 없는 긴 정수(ULONG) 부호 없는 긴 정수
w WORD(부호 없는 짧은) 부호 없는 짧은 정수
x,y x, y 좌표(짧은) 좌표값/짧은 정수
v 무효 무효
다음은 예시입니다.
hwnd: h는 핸들을 의미하고, wnd는 창을 의미하며, 함께 "창 핸들"입니다.
m_bFlag: m은 멤버 변수를 나타내고, b는 부울을 나타냅니다. 이는 "부울 유형의 특정 클래스의 멤버 변수는 상태 플래그입니다."를 의미합니다.
C# .net 명명 규칙
좋은 명명 규칙은 찾기가 너무 어렵기 때문에 직접 유지하는 것이 좋습니다
1 ADO.NET 명명 규칙 데이터 유형 데이터 유형의 약어 표준 명명 예
Northwind 연결
cmd cmdReturnProducts 명령
매개변수 parm parmProductID
DataAdapter 아빠 아빠제품
DataReader dtr dtrProducts
데이터 세트 dst dstNorthWind
데이터테이블 dtbl dtblProduct
DataRow drow drowRow98
DataColumn dcol dcolProductID
데이터관계 drel drelMasterDetail
DataView dvw dvwFilteredProducts
WinForm 컨트롤 명명 규칙
데이터 유형 데이터 유형 약어 표준 명명 예
lblMessage lblMessage 라벨
LinkLabel llbl llblToday
버튼 btn btn저장
텍스트 상자 txt txtName
메인메뉴
체크박스 chk chkStock
라디오버튼 rbtn rbtn선택됨
그룹박스 gbxMain gbxMain
PictureBox 그림 picImage
패널 pnl pnlBody
DataGrid dgrd dgrdView
ListBox lst lstProducts
CheckedListBox clst clstChecked
콤보박스 cbo cboMenu
ListView lvw lvwBrowser
TreeView tvw tvwType
TabControl tctl tctlSelected
DateTimePicker dtp dtpStartDate
HscrollBar hsb hsbImage
VscrollBar vsb vsbImage
타이머 tmr tmrCount
이미지 목록 ilst ilstImage
도구 모음 tlb tlbManage
상태 표시줄 stb stbFootPrint
OpenFileDialog odlg odlgFile
SaveFileDialog sdlg sdlgSave
FoldBrowserDialog fbdlg fgdlgBrowser
FontDialog fdlg fdlgFoot
ColorDialog cdlg cdlgColor
PrintDialog pdlg pdlgPrint
3 WebControl 命name规范
数据类型 数据类型简写 标准命name举例
AdRotator adrt 예
버튼 btn btn제출
캘린더 cal calMettingDates
CheckBox chk chkBlue
CheckBoxList chkl chklFavColors
CompareValidator valc valcValidAge
CustomValidator valx valxDBCheck
DataGrid dgrd dgrdTitles
DataList dlst dlstTitles
DropDownList 드롭 dropCountries
하이퍼링크 lnk lnk세부정보
이미지 img imgAuntBetty
이미지버튼 ibn ibnSubmit
라벨 lbl lblResults
LinkButton lbtn lbtnSubmit
ListBox lst lstCountries
패널 pnl pnlForm2
PlaceHolder plh plhFormContents
라디오버튼 rad rad여성
RadioButtonList radl radlGender
RangeValidator valg valgAge
RegularExpression vale valeEmail_Validator
리피터 rpt rptQueryResults
RequiredFieldValidator valr valrFirstName
테이블 tbl tblCountryCodes
TableCell tblc tblc독일
TableRow tblr tblrCountry
TextBox txt txtFirstName
ValidationSummary vals valsFormErrors
XML xmlcTransformResults
.NET의 명명 규칙
네임스페이스 명명
네임스페이스 이름 지정에 대한 일반적인 규칙은 다음과 같습니다.
회사명.기술명
이런 식으로 우리가 보는 네임스페이스는 다음과 같아야 합니다.
마이크로소프트 오피스
PowerSoft.PowerBuilder
참고: 이는 단지 원칙일 뿐입니다. 제3자 회사가 다른 이름을 선택할 수도 있습니다.
네임스페이스의 접두사로 회사 이름이나 기타 유명 브랜드 이름을 사용하지 마세요. 이렇게 하면 두 개의 게시된 네임스페이스가 동일한 이름을 가질 가능성이 생길 수 있습니다.
예: Microsoft에서 제공하는 Office 자동 클래스의 이름을 Microsoft.Office
로 지정합니다.
파스칼 대문자를 사용하고 논리적 구성요소를 쉼표로 구분하세요.
예: Microsoft.Office.PowerPoint
브랜드가 비전통적인 대문자 사용을 사용하는 경우 일반적인 네임스페이스 대문자 사용 규칙에서 벗어나더라도 브랜드에서 결정한 대문자 사용 스타일을 따르십시오.
예: NeXT.WebObjects
ee.cummings
클래스 및 클래스 구성 요소 이름 지정
클래스 명명 원칙은 파스칼 대문자를 사용하여 명사 또는 명사구로 클래스 이름을 지정하는 것입니다. 클래스 이름에 약어 사용을 줄입니다. 클래스 접두어(예: C)를 사용하지 말고 밑줄 친 문자를 사용하지 마십시오.
예: 공개 클래스 FileStream {}
공개 클래스 버튼 {}
공개 클래스 문자열 {}
CSS 클래스 및 ID의 일반적인 이름:
웹사이트 헤더: head/header(head) top(top) 네비게이션: nanv 네비게이션 구체적인 구분: topnav(상단 네비게이션), mainnav(메인 네비게이션), mininav(미니 네비게이션), textnav(네비게이션 텍스트), subnav(Sub -탐색/보조 탐색)
플래그, 광고 및 상표: 로고(플래그), 브랜드(상표), 배너(슬로건)
검색: sreach(검색), sreachbox(검색창), sreachbtn(검색 버튼), sreachinput(검색 입력 상자)
등록 및 로그인: login(로그인), regsiter(등록), userbox(사용자 이름/비밀번호 텍스트 상자), 비밀번호(password)
레이아웃, 열 및 상자: 레이아웃(레이아웃), bigdiv(큰 div), leftdiv(왼쪽 열), rightdiv(오른쪽 열), leftfloat(왼쪽 부동), rightfloat(오른쪽 부동), mainbox() , 하위 페이지( 하위 페이지/보조 페이지)
바닥글/하단: foot/footer(바닥글/하단), 저작권(저작권 정보), 사이트맵(사이트맵)
기타: 콘텐츠, 스킨, 제목, from, pic, news, shop, list, newslist(뉴스 목록), downloadlist(다운로드 목록), piclist(사진 목록), dropmenv(드롭다운 메뉴), cor/corner (둥근 모서리), 홈페이지(홈페이지), 부스러기(현재 위치 탐색)
사실 위의 ID 네이밍을 구분하기 위해 대문자와 소문자, _를 자주 사용합니다. 예를 들어 메인 네비게이션은 구분이 필요한 경우 MainNav_1, MainNav_2 등이 됩니다. "유형 + 변수 이름" 규칙을 사용하여 이름을 지정할 수도 있습니다. 예를 들어 빨간색 글꼴로 클래스를 작성하면
.f_red{} (f는 글꼴의 약어입니다). 간단히 말해서 대문자, _ 및 약어를 사용하면 코드의 가독성이 크게 향상되는 것이 원칙입니다.
또한 +부모 div에 작성되는 하위 div의 이름을 "in" 작성 방법으로 자주 사용합니다. 이렇게 하면 앞에 이름을 지정한 후 후속 div의 이름을 어떻게 지정해야 할지 모를 수 있습니다. 예를 들어 intop, inbox, infrom, inlogin 등이 있습니다.