반응형

CSS 17

디스플레이의 반대가 있습니까: 없음?

디스플레이의 반대가 있습니까: 없음? 의 입니다.visibility: hidden이라visibility: visible마찬가지로, 반대되는 것이 있습니까?display: none? 많은 사람들은 요소가 있을 때 요소를 보여주는 방법을 이해하는 것이 혼란스러워집니다.display: none그것은 사용하는 것만큼 명확하지 않기 때문에.visibility소유물. 는 그냥 그냥는나는...냥...visibility: hidden에 display: none하지만 그것은 같은 효과를 주지 않기 때문에 저는 그것에 동의하지 않습니다.display: none와 같은 문자 그대로의 반대는 없습니다.visibility:hidden 그렇습니다. 그visibility속성은 요소의 표시 여부를 결정합니다.은 두 상태를 .visi..

source 2023.08.07

CSS에서 글꼴 놀라운 아이콘 사용

CSS에서 글꼴 놀라운 아이콘 사용 다음과 같은 CSS가 있습니다. #content h2 { background: url(../images/tContent.jpg) no-repeat 0 6px; } 이미지를 폰트 어썸의 아이콘으로 바꾸고 싶습니다. 나는 CSS의 아이콘을 배경 이미지로 사용할 방법이 없다고 생각합니다.폰트 어썸 스타일시트/글꼴이 내 CSS보다 먼저 로드된다고 가정하면 이것이 가능합니까?텍스트를 배경 이미지로 사용할 수는 없지만 다음을 사용할 수는 있습니다.:before또는:after모든 종류의 지저분한 추가 마크업을 추가할 필요 없이 텍스트 문자를 원하는 위치에 배치하는 유사 클래스. 설정해야 합니다.position:relative실제 텍스트 래퍼에 위치를 지정할 수 있습니다. .myte..

source 2023.08.02

브라우저에서 OS가 어두운 모드인지 감지하는 방법은 무엇입니까?

브라우저에서 OS가 어두운 모드인지 감지하는 방법은 무엇입니까? 브라우저에 대해서만 "OS X가 다크 모드에 있는지 탐지하는 방법"과 유사합니다. 사용자의 시스템이 Safari/Chrome/Firefox의 새로운 OS X Dark Mode인지 감지할 수 있는 방법이 있는지 찾은 사람 있습니까? 우리는 현재 운영 모드를 기준으로 사이트의 디자인을 다크 모드 친화적으로 변경하고 싶습니다.새로운 표준은 미디어 쿼리 레벨 5의 W3C에 등록됩니다. 참고: 현재 사용할 수 있는 위치Safari 기술 미리 보기 릴리스 68 가 .light: /* Light mode */ @media (prefers-color-scheme: light) { body { background-color: white; color: bla..

source 2023.07.28

모바일 웹의 최대 장치 너비와 최대 너비의 차이점은 무엇입니까?

모바일 웹의 최대 장치 너비와 최대 너비의 차이점은 무엇입니까? 아이폰/안드로이드 폰용 html 페이지를 개발해야 하는데, 무엇이 다른가요?max-device-width그리고.max-width화면 크기에 따라 다른 CSS를 사용해야 합니다. @media all and (max-device-width: 400px) @media all and (max-width: 400px) 뭐가 달라요?max-width대상 표시 영역의 너비입니다(예: 브라우저). max-device-width장치의 전체 렌더링 영역(즉, 실제 장치 화면)의 너비입니다. 그것도 마찬가지입니다.max-height그리고.max-device-height당연히.max-width뷰포트의 폭을 참조하며 특정 크기 또는 방향을 목표로 하는 데 사용할 ..

source 2023.07.28

SCSS와 Sass의 차이점은 무엇입니까?

SCSS와 Sass의 차이점은 무엇입니까? 제가 읽은 바로는, Sass는 변수와 수학 지원으로 CSS를 더 강력하게 만드는 언어입니다. SCSS와 다른 점은 무엇입니까?같은 언어여야 하나요?비슷하다고요?달라요?Sass는 구문이 향상된 CSS 프리프로세서입니다.고급 구문의 스타일 시트는 프로그램에 의해 처리되고 일반 CSS 스타일 시트로 변환됩니다.그러나 CSS 표준 자체를 확장하지는 않습니다. CSS 변수는 지원되며 사용할 수 있지만 전처리 변수만큼은 사용할 수 없습니다. SCSS와 Sass의 차이에 대해 Sass 설명서 페이지의 이 텍스트는 다음과 같은 질문에 답해야 합니다. 은 SCSS 확장자를 합니다..scss몇 가지 작은 예외를 제외하고는 CSS의 슈퍼셋이며, 이는 기본적으로 유효한 모든 CSS도..

source 2023.07.13

CSS calc() 함수의 Sass 변수

CSS calc() 함수의 Sass 변수 저는 그것을 사용하려고 합니다.calc()Sass 스타일시트에서 기능을 하는데 문제가 좀 있습니다.내 코드는 다음과 같습니다. $body_padding: 50px body padding-top: $body_padding height: calc(100% - $body_padding) 만약 내가 문자 그대로 사용한다면,50px내 것 대신에body_padding변수, 난 내가 원하는 것을 정확히 얻습니다.그러나 변수로 전환하면 다음과 같은 출력이 표시됩니다. body { padding-top: 50px; height: calc(100% - $body_padding); } 어떻게 하면 Sass가 내 변수를 대체해야 한다는 것을 인식할 수 있습니까?calc기능?보간: bo..

source 2023.07.08

어떻게 하면 디브에서 절대적으로 위치한 요소를 중심에 둘 수 있습니까?

어떻게 하면 디브에서 절대적으로 위치한 요소를 중심에 둘 수 있습니까? 다음을 배치합니다.div(와 함께)position:absolute;) 창 중앙에 있는 요소입니다.하지만 너비를 알 수 없기 때문에 그렇게 하는 데 어려움을 겪고 있습니다. 아래의 CSS 코드를 시도해 보았지만, 폭이 반응하기 때문에 조정이 필요합니다. .center { left: 50%; bottom: 5px; } 어떻게 하면 이를 달성할 수 있을까요?이것은 나에게 도움이 됩니다. #content { position: absolute; left: 0; right: 0; margin-left: auto; margin-right: auto; width: 100px; /* Need a specific value to work */ } I'..

source 2023.06.08
반응형