사용자 에이전트 스타일 시트 란 무엇입니까
Chrome의 웹 페이지에서 작업 중입니다. 다음 스타일로 올바르게 표시됩니다.
table {
display: table;
border-collapse: separate;
border-spacing: 2px;
border-color: gray;
}
이 스타일을 정의하지 않았다는 점에 유의해야합니다. Chrome 개발 도구에서는 CSS 파일 이름 대신 사용자 에이전트 스타일 시트가 표시 됩니다.
이제 양식을 제출하고 일부 유효성 검사 오류가 발생하면 다음 스타일 시트가 나타납니다.
table {
white-space: normal;
line-height: normal;
font-weight: normal;
font-size: medium;
font-variant: normal;
font-style: normal;
color: -webkit-text;
text-align: -webkit-auto;
}
table {
display: table;
border-collapse: separate;
border-spacing: 2px;
border-color: gray;
}
font-size이 새로운 스타일에서 내 디자인을 방해한다. 스타일 시트를 강제로 적용하고 가능한 경우 Chrome의 기본 스타일 시트를 완전히 덮어 쓰는 방법이 있습니까?
대상 브라우저는 무엇입니까? 브라우저마다 다른 기본 CSS 규칙을 설정합니다. meyerweb css reset 또는 normalize.css 와 같은 CSS 재설정을 포함시켜 이러한 기본값을 제거하십시오. 차이점을 보려면 Google "css reset vs normalize"를 참조하십시오.
경우 <!DOCTYPE>귀하의 HTML에없는 당신은 브라우저 사용자 지정 스타일 시트를 통해 "사용자 에이전트 스타일"에 우선 순위를 준다 발생할 수 있습니다. doctype을 추가하면이 문제가 해결됩니다.
"사용자 에이전트 스타일 시트"개념에 대해서는 CSS 2.1 스펙의 Cascade 섹션을 참조하십시오 .
사용자 에이전트 스타일 시트는 사용자가 자신의 스타일 시트에서 설정 한 것으로 대체됩니다. 그들은 단지 최저 있습니다 : 페이지 또는 사용자가 제공하는 스타일 시트가 없을 경우, 브라우저는 여전히 콘텐츠를 렌더링하는 어떻게 든 , 사용자 에이전트 스타일 시트는이에 대해 설명합니다.
따라서 사용자 에이전트 스타일 시트에 문제가 있다고 생각되면 마크 업, 스타일 시트 또는 둘 다 (아무 것도 쓰지 않은)에 문제가있는 것입니다.
첫 번째 줄에 적절한 문서 유형으로 문서를 HTML5로 표시하면 문제가 해결되었습니다.
<!DOCTYPE html>
<html>...
사용자 에이전트 스타일 시트는 "일반적인 프리젠 테이션 기대"를 만족시키는 방식으로 페이지를 표시하기 위해 브라우저 (예 : Chrome, Firefox, Edge 등)가 제공하는 "기본 스타일 시트"입니다. 예를 들어, 기본 스타일 시트는 글꼴 크기, 테두리 및 요소 간 간격과 같은 기본 스타일을 제공합니다. 브라우저 간의 불일치를 처리하기 위해 재설정 스타일 시트 를 사용하는 것이 일반적 입니다.
사양에서 ...
사용자 에이전트의 기본 스타일 시트는 문서 언어에 대한 일반적인 프리젠 테이션 기대를 충족시키는 방식으로 문서 언어 요소를 제공해야합니다. ~ 캐스케이드 .
일반적으로 사용자 에이전트에 대한 자세한 내용은 ...
https://www.w3.org/TR/UAAG20/#def-user-agent
고유 한 CSS에서 Chrome의 사용자 에이전트 스타일에서 사용하지 않으려는 값을 정의하십시오.
제목에 질문에 대답하고, 사용자 에이전트 스타일 시트는 무엇이며 브라우저의 기본 스타일 세트는 다음과 같습니다.
게코 (Firefox) : https://dxr.mozilla.org/mozilla-central/source/layout/style/res/html.css
크롬 (Chrome) : https://cs.chromium.org/chromium/src/third_party/blink/renderer/core/html/resources/html.css?q=html.css&sq=package:chromium&dr
WebKit (Safari) : https://trac.webkit.org/browser/trunk/Source/WebCore/css/html.css
일부 브라우저는 자체 방식으로 .css 파일을 읽습니다. 따라서 이것을 극복하는 올바른 방법 : .html 소스 코드에 명령 줄을 직접 입력하면 .css 파일을 능가합니다. 그러면 브라우저가 직접해야 할 일을 말했고 브라우저는 읽을 수 없습니다. .css 파일의 명령 .html 파일에 작성된 명령은 .css의 명령보다 강력합니다.
내 브라우저 중 하나에 브라우저에서 여백이 설정되어있는 것과 같은 문제가 있었지만 꽤 성가신 것이었지만 대부분의 사람들이 말한 것처럼 마크 업 오류를 알았습니다.
나는 돌아가서 내 섹션을 확인했고 내 CSS 링크는 다음과 같습니다.
<link rel="stylesheet" href="ex.css">
나는 그것에 유형을 포함시키고 아래와 같이 만들었습니다.
<link rel="stylesheet" type="text/css" href="ex.css">
내 문제가 해결되었습니다.
그것이 당신의 일부에게 도움이되기를 바랍니다.
HTML 파일이 지정하지 않은 경우 각 브라우저는 사용자 에이전트 스타일 시트라고하는 기본 스타일 시트를 제공합니다. 지정한 스타일이 기본값보다 우선합니다. 테이블 요소 상자에 값을 지정하지 않았으므로 기본 스타일이 적용되었습니다
CSS 파일에 다음 코드를 넣으십시오
table {
font-size: inherit;
}
참고 URL : https://stackoverflow.com/questions/12582624/what-is-user-agent-stylesheet
'Programming' 카테고리의 다른 글
| 툴바에 뒤로 화살표 표시 (0) | 2020.02.16 |
|---|---|
| 각도 지시문-컴파일, 컨트롤러, 사전 링크 및 사후 링크 사용시기 및 방법 [폐쇄] (0) | 2020.02.16 |
| Google CDN에서 jQuery UI CSS 다운로드 (0) | 2020.02.16 |
| Python Ellipsis 객체는 무엇을합니까? (0) | 2020.02.16 |
| Python 프로그램을 50 밀리 초 동안 잠자 게하려면 어떻게해야합니까? (0) | 2020.02.16 |