반응형

css 10

요소 텍스트를 기반으로 한 CSS 선택기?

요소 텍스트를 기반으로 한 CSS 선택기? 이 질문에는 이미 다음과 같은 답변이 있습니다. 특정 텍스트를 포함하는 요소에 대한 CSS 셀렉터가 있습니까? (21개 답변) 닫힘3년 전에. 요소 텍스트를 기반으로 CSS에서 요소를 선택하는 방법이 있습니까? 즉: li[text=*foo] foo bar 그건 아마 효과가 없을 겁니다. 편집: Chrome만 지원하면 됩니다.당신이 찾는 것이 정확하지 않다는 것을 알지만, 아마 당신에게 도움이 될 것입니다. jQuery selector를 사용하고 클래스를 추가한 다음 클래스에 대해 일반 스타일을 수행할 수 있습니다.CSS를 직접 사용하는 것이 아니라 내부 내용을 기반으로 자바스크립트를 통해 CSS 속성을 설정할 수 있지만 결국 CSS의 정의에 따라 동작해야 합니다..

sourcecode 2023.11.04

아웃라인과 경계 CSS 속성의 차이점은 무엇입니까?

아웃라인과 경계 CSS 속성의 차이점은 무엇입니까? 입니까의 입니까?border그리고.outlineCSS의 속성? 차이가 없다면 같은 것에 대해 두 가지 속성이 존재하는 이유는 무엇입니까?보낸이: http://webdesign.about.com/od/advancedcss/a/outline_style.htm CSS 개요 속성은 혼란스러운 속성입니다.처음에 알게 되면 국경지역과 멀리 떨어진 곳까지 어떻게 다른지 이해하기가 어렵습니다.W3C는 다음과 같은 차이점이 있다고 설명합니다. 윤곽선은 공간을 차지하지 않습니다. 윤곽선이 직사각형이 아닐 수 있습니다. 다른 답변들 외에...제가 생각할 수 있는 몇 가지 차이점은 다음과 같습니다. 1) 둥근 모서리 border다로 합니다.border-radius소유물.ou..

sourcecode 2023.10.15

LESS 변수의 알파 불투명도 수정

LESS 변수의 알파 불투명도 수정 LESS를 사용하면 색상 변수의 채도나 색조를 변경할 수 있습니다.이것은 다음과 같습니다. background: lighten(@blue, 20%); 하지만 저는 제 색깔의 알파 불투명도를 바꾸고 싶습니다.가급적이면 다음과 같습니다. background: alpha(@blue, 20%); LESS에서 이를 수행할 수 있는 간단한 방법이 있습니까?사이트 설명서는 다음과 같은 답변을 제공합니다. background: fade(@blue, 20%); 함수 이름은fade것은 아니다.alpha그 서류에 의하면완성도를 위하여 색이 바래다 색상의 절대 투명도를 설정합니다.색상에 이미 불투명도 값이 있는지 여부에 관계없이 색상에 적용할 수 있습니다. background: fade(@..

sourcecode 2023.09.05

비활성화되지 않은 경우에만 호버 및 활성화

비활성화되지 않은 경우에만 호버 및 활성화 단추 스타일을 지정하려면 호버, 활성 및 비활성화를 사용합니다. 그러나 문제는 버튼이 비활성화된 경우 호버 및 활성 스타일이 계속 적용된다는 것입니다. 활성화된 버튼에만 호버 및 활성화를 적용하는 방법은 무엇입니까?:enabled pseudo-class를 사용할 수 있지만 알림에서 지원하지 않습니다. button:hover:enabled{ /*your styles*/ } button:active:enabled{ /*your styles*/ } .button:active:hover:not([disabled]) { /*your styles*/ } 당신은 이것을 시도할 수 있습니다.CSS에서 "disabled" 속성을 사용하지 않는 이유.이것은 모든 브라우저에서 작동..

sourcecode 2023.08.26

요소에 여러 개의 CSS 전환을 갖는 방법은 무엇입니까?

요소에 여러 개의 CSS 전환을 갖는 방법은 무엇입니까? 꽤 간단한 질문이지만 CSS 전환 속성에 대한 좋은 문서를 찾을 수 없습니다.다음은 CSS 스니펫입니다. .nav a { text-transform:uppercase; text-decoration:none; color:#d3d3d3; line-height:1.5 em; font-size:.8em; display:block; text-align:center; text-shadow: 0 -1.5em 0 rgba(255, 255, 255, 0.15); -webkit-transition: color .2s linear; -moz-transition: color .2s linear; -o-transition: color .2s linear; transiti..

sourcecode 2023.08.16

CSS를 사용하면 다중 행의 오버플로 블록에 "..."를 사용합니다.

CSS를 사용하면 다중 행의 오버플로 블록에 "..."를 사용합니다. 와 함께 overflow: hidden; text-overflow: ellipsis; white-space: nowrap; 오버플로우된 경우 줄의 끝에 표시됩니다.그러나 이는 한 줄에만 표시됩니다.하지만 저는 그것이 여러 줄로 표시되기를 원합니다. 다음과 같이 보일 수 있습니다. +--------------------+ |abcde feg hij dkjd| |dsji jdia js ajid s| |jdis ajid dheu d ...|/*Here it's overflowed, so "..." is shown. */ +--------------------+ 또한 이 문제를 다루는 여러 jquery 플러그인이 있지만 여러 줄의 텍스트를 처..

sourcecode 2023.08.06

">"(표시보다 큼) CSS 선택기는 무엇을 의미합니까?

">"(표시보다 큼) CSS 선택기는 무엇을 의미합니까? 예: div > p.some_class { /* Some declarations */ } 정확히 무엇을 하는 것입니까?>수화 평균?>하위 결합자이며, 직접 1결합자로 잘못 불리기도 합니다. 즉, 셀렉터가div > p.some_class의 단락만 일치합니다..some_class바로 내부에 내포된 것들div더 안쪽에 내포된 단락은 없습니다.이는 모든 요소가 일치한다는 것을 의미합니다.div > p.some_class또한 반드시 일치합니다.div p.some_class하위 결합자(공간)와 함께, 따라서 두 가지는 이해할 수 있을 만큼 자주 혼동됩니다. 하위 조합과 하위 조합을 비교하는 그림: div > p.some_class { background: y..

sourcecode 2023.07.27

CSS - HTML 페이지 바닥글을 최소 높이로 페이지 하단에 유지하되 페이지와 겹치지 않도록 합니다.

CSS - HTML 페이지 바닥글을 최소 높이로 페이지 하단에 유지하되 페이지와 겹치지 않도록 합니다. 다음 있습니다. (데드링크: 데있다습니가크지링페드이다음데:▁((▁i다크니:http://www.workingstorage.com/Sample.htm페이지 하단에 배치할 수 없는 바닥글이 있습니다. 바닥글을 다음과 같이 지정 페이지가 짧고 화면이 채워지지 않을 때 창 하단에 붙습니다. 화면 가득 내용이 있을 때(내용이 중복될 가능성이 있음) 문서 끝에 머무르며 정상적으로 아래로 이동합니다. CSS는 유전되고 나를 혼란스럽게 합니다.내용물에 최소 높이를 두거나 바닥글이 아래로 내려가도록 제대로 변경할 수 없는 것 같습니다.아래에는 4가지 다른 나의 방법이 있습니다. 각 예제에서 텍스트는 다양한 시나리오에서 ..

sourcecode 2023.06.12

참조:Chrome Developer Tools의 hover state

참조:Chrome Developer Tools의 hover state 나는 그것을 보고 싶습니다.:hover제가 크롬에서 맴도는 앵커 스타일입니다.Firebug에는 요소에 대해 다른 상태를 선택할 수 있는 스타일 드롭다운이 있습니다. 크롬에서 비슷한 것을 찾을 수 없는 것 같습니다.내가 뭘 빼놓았나요? 이제 유사 클래스 규칙을 모두 보고 요소에 강제 적용할 수 있습니다. 와 같은 :hover[] [[스타일]]을 누릅니다.:hov오른쪽 위에 있는 텍스트. 요소를 강제로 삽입하는 방법:hover상태, 마우스 오른쪽 버튼을 클릭하고 선택합니다.:hover. Chrome Developer Tools 바로 가기의 요소 패널에 대한 추가 팁. 편집: 이 답변은 버그 수정 이전의 것입니다. 컷트의 답변을 참조하십시오..

sourcecode 2023.06.12

div 내에서 텍스트 수직 정렬

div 내에서 텍스트 수직 정렬 이 질문에는 이미 다음과 같은 답이 있습니다. div에서 텍스트를 수직으로 정렬하려면 어떻게 해야 합니까? (34개 답변) 마감됨9년 전에. 아래 코드(JS Fiddle에서 데모로도 사용 가능)는 이상적으로는 원하는 대로 텍스트를 가운데에 배치하지 않습니다.텍스트를 수직으로 중앙에 배치할 수 있는 방법을 찾을 수 없습니다.div을 사용하는 경우에도margin-top기여하다.어떻게 해야 하나요? 1234 yet another text content that should be centered vertically #column-content { display: inline-block; border: 1px solid red; position:relative; } #column-..

sourcecode 2023.06.02
반응형