css 17

디스플레이: 인라인 플렉스와 디스플레이: 플렉스의 차이점은 무엇입니까?

디스플레이: 인라인 플렉스와 디스플레이: 플렉스의 차이점은 무엇입니까? ID 래퍼 내에서 요소를 수직으로 정렬하려고 합니다.나는 재산을 줬습니다.display:inline-flex;이 ID에 대해 ID 래퍼가 플렉스 컨테이너입니다. 하지만 발표에는 차이가 없습니다.이 표시될 했습니다.inline왜 그렇지 않습니까? #wrapper { display: inline-flex; /*no difference to display:flex; */ } header nav aside main footer display: inline-flex유연한 항목은 인라인으로 표시되지 않습니다.Flex 컨테이너가 인라인으로 표시되도록 합니다.그것이 사이의 유일한 차이점입니다.display: inline-flex그리고.display..

programing 2023.08.15

플로팅 차일드 디브의 키를 부모 키로 확장하려면 어떻게 해야 합니까?

플로팅 차일드 디브의 키를 부모 키로 확장하려면 어떻게 해야 합니까? 페이지 구조는 다음과 같습니다. 이, 제.child-left더 내용을 에 DIV는 더많가것질이고를그, ▁div,.parentDIV의 키는 어린이 DIV에 따라 커집니다. 는 하만문입니다.child-right높이가 증가하지 않습니다.어떻게 하면 그것의 높이를 그것의 부모와 같게 만들 수 있습니까?의 parent요소, 다음 속성을 추가합니다. .parent { overflow: hidden; position: relative; width: 100%; } 그렇다면.child-right다음 항목: .child-right { background:green; height: 100%; width: 50%; position: absolute; rig..

programing 2023.08.10

div의 CSS 사용자 정의 스크롤 막대

div의 CSS 사용자 정의 스크롤 막대 하나의 CSS(Cascading Style Sheets)에 CSSSheets)를를 어떻게 지정할 수 ?div전체 페이지가 아니라구요?스크롤바, CSS, 브라우저 호환성에 대한 최신 정보를 통합하는 것이 도움이 될 것이라고 생각했습니다. 스크롤 막대 CSS 지원 현재 크로스 브라우저 스크롤 막대 CSS 스타일 정의가 없습니다.마지막에 언급한 W3C 기사에는 다음과 같은 내용이 포함되어 있으며 최근에 업데이트되었습니다(2014년 10월 10일). 일부 브라우저(IE, Konqueror)는 비표준 속성 '스크롤바 그림자-색상', '스크롤바-트랙-색상' 등을 지원합니다.이러한 속성은 불법입니다. CSS 사양에서 정의되지도 않고 독점으로 표시되지도 않습니다("-vendor..

programing 2023.08.10

CSS 너비/높이 또는 HTML 콜/행 속성으로 텍스트 영역 크기를 지정해야 합니까?

CSS 너비/높이 또는 HTML 콜/행 속성으로 텍스트 영역 크기를 지정해야 합니까? ▁a▁that때▁includes를 포함하는 새로운 양식을 할 수 있습니다.textarea치수를 지정해야 할 때 다음과 같은 딜레마가 있습니다. CSS를 사용하거나textarea의성cols그리고.rows? 각 방법의 장단점은 무엇입니까? 이러한 속성을 사용하는 것의 의미는 무엇입니까? 보통 어떻게 해요?둘 다 사용하는 것을 추천합니다.행과 콜은 클라이언트가 CSS를 지원하지 않는 경우에 필요하고 유용합니다.하지만 디자이너로서 저는 제가 원하는 크기를 얻기 위해 그것들을 덮어씁니다. 권장되는 방법은 외부 스타일시트를 사용하는 것입니다. textarea { width: 300px; height: 150px; } textare..

programing 2023.08.10

플렉스 항목이 컨테이너를 초과하지 않도록 방지

플렉스 항목이 컨테이너를 초과하지 않도록 방지 Flex 항목을 만드는 방법(article이 예에서는)를 사용합니다.flex-grow: 1; 유연한 상위/하위 항목이 오버플로되지 않도록(main)? 이 예에서는article다른 요소를 포함할 수 있지만 텍스트일 뿐입니다(tables 등). main, aside, article { margin: 10px; border: solid 1px #000; border-bottom: 0; height: 50px; } main { display: flex; } aside { flex: 0 0 200px; } article { flex: 1 0 auto; } x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x..

programing 2023.08.05

HTML에서 한 이미지를 다른 이미지 위에 어떻게 배치합니까?

HTML에서 한 이미지를 다른 이미지 위에 어떻게 배치합니까? 저는 한 페이지에 많은 이미지를 보여주려고 시도하는 레일 프로그래밍의 초보자입니다.일부 이미지는 다른 이미지 위에 올려집니다.쉽게 설명하기 위해 파란색 사각형을 원하며, 파란색 사각형의 오른쪽 상단 모서리에 빨간색 사각형이 있습니다(단, 모서리가 조이지는 않습니다).성능 문제로 인해 (ImageMagick 등을 사용한) 합성을 피하려고 합니다. 중복되는 이미지를 서로 상대적으로 배치하고 싶습니다. 더 어려운 예로, 더 큰 이미지 안에 주행 기록계가 있다고 상상해 보십시오.6자리수의 경우, 백만 개의 다른 이미지를 합성하거나, 또는 모든 것을 즉시 수행해야 합니다. 필요한 것은 6개의 이미지를 다른 하나의 이미지 위에 놓는 것입니다.잠시 후, ..

programing 2023.07.31

테이블 셀에서 CSS 텍스트 오버플로?

테이블 셀에서 CSS 텍스트 오버플로? 저는 CSS CSS를 .text-overflow텍스트가 한 줄에 맞지 않을 정도로 길면 여러 줄로 묶는 대신 줄임표로 클리핑합니다.이것이 가능합니까? 시도해 봤습니다. td { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } 그데그런.white-space: nowrap텍스트(및 해당 셀)가 계속 오른쪽으로 확장되어 테이블의 전체 너비를 컨테이너 너비 밖으로 밀어내는 것처럼 보입니다.그러나 텍스트가 없으면 텍스트가 셀 가장자리에 닿으면 여러 줄로 계속 감깁니다.표 셀을 초과할 때 생략 부호가 있는 텍스트를 클리핑하려면 다음을 설정해야 합니다.max-width "" "" CSS ""의 td오버플로 작..

programing 2023.06.01