프로그래밍 스타일은 사람의 성격과 같습니다. 프로그래머(디자이너)마다 글쓰기 스타일이 다르기 때문에 다른 사람들이 받아들이기 쉽습니다. WordPress 테마를 예로 들면, 우리는 좋은 코드 스타일과 취향에 맞는 테마 파일을 사용하는 것을 선호할 수 있습니다. 지저분하고 읽기 어려운 CSS 파일을 연구해야 할 때 우리는 무엇을 합니까? "Styleneat"을 사용하면 계단식 구조에 따라 CSS 선택기, 하위 선택기 및 속성을 재구성하고 구축할 수 있으므로 CSS 파일을 더욱 깔끔하고 읽기 쉽게 만들 수 있습니다. 페이지 레이아웃을 정의하고 다양한 구조 간의 관계를 확인하는 것이 더 쉽습니다.
"
Styleneat " CSS 파일 구조 형식 재구성 서비스는 지저분한 쓰기 스타일이 포함된 CSS 파일을 계단식 구조로 재구성하여 읽기 및 조사를 용이하게 할 수 있는 매우 실용적인 온라인 도구입니다.
세 가지 방법으로 사용할 수 있습니다. 1. 코드를 직접 붙여넣습니다. 2. CSS 파일을 업로드합니다. 3. CSS 파일의 주소를 입력합니다. 몇 가지 옵션 설정도 있습니다: CSS 속성 및 선택기에 따라 알파벳순으로 정렬, 가져온 CSS 재구성, 안전 재구성 모드 켜기.
사용 효과를 살펴 보겠습니다.
원본 코드:
예제 소스 코드
[www.downcodes.com]
#메뉴바 .menus {
배경:#E9EEF1;
부동:왼쪽;
패딩:0 10px;
}
#menubar .menus li {
부동:왼쪽;
테두리 스타일:단색;
테두리 색상:#FFF;
테두리 너비:0 1px;
여백-왼쪽:-1px;
목록 스타일 유형:없음;
}
#menubar .menus li a { 디스플레이:블록;텍스트 장식:없음;패딩:5px 10px;}
#menubar .menus li a:hover {
배경:#EEDDCC;
목록 스타일 유형:없음;
}
#menubar .menus .current_page_item {
배경:#FFF;
글꼴 두께:굵게;
}
#menubar .menus li.current_page_item a:hover {
배경:#FFF;
}
재구성된 코드:
예제 소스 코드
[www.downcodes.com]
#메뉴바 .menus {
배경:#E9EEF1;
부동:왼쪽;
패딩:0 10px }
#menubar .menus li {
부동:왼쪽;
테두리 스타일:단색;
테두리 색상:#FFF;
테두리 너비:0 1px;
여백-왼쪽:-1px;
목록 스타일 유형:없음 }
#menubar .menus li a {
표시:블록;
텍스트 장식:없음;
패딩:5px 10px }
#menubar .menus li a:hover {
배경:#EEDDCC;
목록 스타일 유형:없음 }
#menubar .menus .current_page_item {
배경:#FFF;
글꼴 두께:굵게 }
#menubar .menus li.current_page_item a:hover { 배경:#FFF }
