저는 (현대) 웹 개발에 익숙하지 않습니다. 어쨌든, jquery를 사용하는 이미지 회전기와 드롭 다운 메뉴를 다운로드했습니다. 자, 저는 그것들을 합쳐서 잘 작동합니다. 그러나이 드롭 다운 메뉴를 사용하면 수직 선택 목록 대신 수평으로 잘라낸 그림을 볼 수 있습니다.어떻게 하나의 CSS 파일을 "디버그"합니까
나는 이미지 A, B, C를 어떤 이유로 든 왼쪽에서 오른쪽으로 서로 수직으로 배치합니다. 그래서 저는 그것들을 작은 테이블에 집어 넣으려고 했었습니다 - 테두리 = 0이라고해도 왼쪽에서 오른쪽으로 틈이없는 대신 그림 사이에 작은 간격이 존재하도록합니다.
디버깅을하려면 어떻게해야합니까? 이?
다운로드 불을 지르고, 또는 (Ctrl 키를 + 변화 + J) 당신이 웹 페이지를 편집하고 볼 수 있기 때문에
화재 버그가 당신을 위해 더 좋을 수를 구글 크롬 웹 디버거를 사용하여 시도 특정 CSS 호출이 페이지에 어떤 영향을 미치는지. 내가 모든 시간을 사용하는 것입니다
다른 브라우저에 불을 지르고를 실행할 수 있습니다 다운로드 (아프 링크)도 있습니다
편집
Firefox 용 Firebug 플러그인을 사용해보십시오. 이 도구를 사용하여 간단한 포인트/클릭으로 dom 요소에 적용되는 규칙을 결정할 수 있습니다.
또한 CSS를 즉시 편집하고 변경 사항을 바로 확인할 수 있습니다. 모든 변경 후에 새로 고침하고 싶지 않습니다 .. Firebug에서 CSS를 변경하고 만족할 만하게되면 다시 파일에 복사하십시오.
방화범은 이제 없어서는 안될 필수 아이템입니다. 우리가 어떻게 "옛날에"그렇게했는지 궁금합니다. – numbers1311407
최신 브라우저를 사용하면 페이지 요소의 정확한 CSS를 검사 할 수 있습니다. 이러한 기능을 사용하여 디버그 할 수 있습니다. 크롬에서
Firefox에는 here에서 다운로드 할 수있는 FireBug 플러그인이 있습니다.
IE에는 개발자 도구가 있습니다. F12를 누르십시오.
사파리가 가지고있는 것은 확실하지 않지만 아마도 비슷할 것입니다.
Firefox (플러그인) 용 "Web Developer Toolbar"를 제안한 다음 CSS-> 스타일 정보보기로 이동하십시오.
주요 디버깅 도구는 Firebug for Firefox 및 Chrome 및 Safari의 검사기와 같은 도구를 사용하여 문제를 해결할 수 있도록 일부 규칙을 강제 적용하기 위해 "! important"규칙을 사용하여 계산 된 CSS또한 Firefox 용 Web Developer Toolbar에는 라이브 DOM 트리를 확인할 수있는 풍부한 DOM 도구가 있습니다.
대부분의 웹 브라우저에는 Web Inspector가 내장되어 있습니다.이 도구를 사용하여 페이지의 요소를 검사하고 추가, 제거하거나 제거 할 수 있습니다 스타일. 종종 디버깅 문제가 있으면 스타일을 제거하려고 시도하지만 가끔은 추가해야합니다. 다음 예는 다음과 같습니다 내가있는 경우 :
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Hello World</title>
<style>
#hello { color: white }
</style>
</head>
<body>
<p id="hello">Hello World</p>
</body>
</html>
#hello가 표시되지 않습니다. Chrome에서 Web Inspector를 사용하여 다음을 찾을 수 있습니다. 
* 실제 문제 *에 대한 이해가 올바르면 "기존 코드 디버그"가 아닌 "새 코드 작성"이 필요합니다. – thirtydot