HTML의 이상한 간격

site을 개발하는 데 이상한 문제가 있습니다.HTML의 이상한 간격

내 컴퓨터의 브라우저는 페이지의 일부 요소 위에 간격을 추가합니다 (예 : 탐색 바 위, 탐색 바 아래의 드롭 다운, 컨테이너 등).

하지만 소스 코드가 표시없이 :

나는 도구에서 인용이 삭제하면 Chrome 개발자 도구에서는 이상한 text 요소 (간격 따옴표)를 가진 것처럼 표시 간격이 사라집니다.

자바 스크립트 또는 PHP에서는 따옴표 (공백)를 추가 할 수 없습니다. 모든 스크립트가 .html 개의 파일 (example)에 대한 php 전처리를 포함하고 사용하지 않도록 주석을 달았습니다. CSS로이 간격을 추가 할 수 없습니다 (예 : navbar에 대한 규칙이 있습니다 :

.navbar { 
    margin-top: 0; 
}

간격은 내 컴퓨터의 모든 브라우저 (Firefox, Chrome, IE 9에서 테스트 됨)에 있습니다.

을하지만, 크롬 개발자 도구의 인용이있는 곳 그 곳에서 코드에서 간격을 추가

또한, 파이어 폭스 개발자 도구는 따옴표를 표시하지 않습니다.

그럼, 무엇입니까? 이 간격을 제거하는 방법 (나는 음수 여유와 같은 추악한 솔루션을 사용하고 싶지 않습니다)?

의견이 기계에이 문제가 있습니까? 감사.

출처

2012-09-07 Ivan Akulov

하하, 나는 PHP를 시작했을 때 너의 나이였다. 나는 21 세가되었고 프로그래밍에 성공적인 경력을 쌓았습니다. 그것은 위대한 직업 :) 그것을 계속, 행운을 빌어 요. – user1477388

어딘가에서 Html을 복사하여 붙여 넣은 경우 일부 숨겨진 문자를 복사했을 수 있습니다. 이는 jsfiddle에서 Visual Studio로 복사 할 때 알려진 문제입니다. –

@ 존 : 그래, 지금까지 성공 했어. 나는 많은 경험을 쌓았고, 많은 돈을 벌었 다. – user1477388

공백은  과 같은 '특수 공백'입니다. 텍스트 편집기에서도 일반 공백 문자처럼 보일 수 있습니다.

HTML 구조를 생성하는 코드를 살펴보십시오. 그런 다음 요청에있는 공백을 삭제하십시오. 스페이스 바 키를 사용하여 포매팅 공간을 되돌립니다. 가까이 내가 깨달았 내 텍스트 편집기에서 찾고

편집

, 당신은 당신의 코드에 특별한 구별 특성을 가지고있다. 메모장 ++ 편집기에서 내 화면을 볼 때

는 <nav>의 미만 문자 (<) 내가 빨간색으로 표시된 <li> 태그에서 작은 '고리'가있다.

공백을 삭제하지 말고 문자보다 작은 문자 (<)도 삭제하고 키보드를 사용하여 다시 입력하십시오. 바이트 순서 표시 (UTF-8 EF BB BF) (일명 제로 폭 비 분리 공백) U + FEFF - <body> 및 <nav> 요소 사이

enter image description here

출처

2012-09-07 14:58:26 HerrSerker

잘 잡습니다. 나는이 문제를 직접 경험했고 그것은 찾기 힘든 것이다. – Wex

+1, 독수리 눈 : – Jon

고맙습니다. 선택기를 사용하여 div를 타겟팅 할 수 없었고 왜 작동하지 않는지 궁금했습니다. 숨겨진 겨우 눈에 띄는 캐릭터가 문제였습니다. 큰 도움이됩니다! – Systembolaget

소스 HTML에 <body>과 <nav> 사이의 공백이 있습니다. 유일한 방법은

<body><nav class="..."> ... </nav></body>

HTML 속성 값 이외의 공백의 실행이 하나 개의 공간으로 취급되는 지시에 같이 함께 두 개의 태그를 실행하는 것입니다 멀리 갈 수 있도록, 그래서 아무리 정말하지 않습니다 HTML에 공백 문자가 하나라도 적합 한 브라우저는이를 텍스트 노드로 취급해야합니다. 따옴표를 표시함으로써 크롬이 암시하는 텍스트 노드입니다.

출처

2012-09-07 14:46:57 Jon

보이지 않는 공백을 삭제할 수는 있지만, 작동하지 않는다면 태그 바로 옆에 태그를 붙여보십시오. – Kzqai

공백 문자는 ''이'display : block'이고, '

의 문자는 줄 바꿈과 BOM 있습니다. 16 진수 편집기

enter image description here

그것은 당신이 제거하는 데 필요한 BOM의 네오

에서 가져온 아래 그림을 참조하십시오.

출처

2012-09-07 15:27:52 Alohci

+1 진수 편집기 – HerrSerker

답변

관련 문제