'CSS' 태그의 글 목록

실제 이미지 크기를 표시하는 동안 올빼미 회전 목마 추가 공간

질문 리얼리티 워드프레스 테마를 사용하고 있는데, 테마 중심의 실제 이미지를 보여 주려고합니다. 이 를보세요. CSS를 다음과 같이 수정했습니다. .iwp-property-gallery-slider-v1 .owl-item figure img { position: relative; width: auto; max-width: 800px; } 여기 이미지는 항목의 각 끝에 추가 공백이 있습니다. 어떤 도움이라도 대단히 감사하겠습니다. 답변1 autowidth는 CSS로 제어 할 수있는 것이 아닙니다. autoWidth : true 를 사용하여 js에서 활성화해야합니다. Document 확인 여기 출처 : https://stackoverflow.com/questions/63434890/owl-carousel-e..

카테고리 없음 2020. 8. 21. 00:07

오른쪽 화살표가있는 CSS button

질문 이 button을 만드는 가장 쉬운 방법은? 지금까지는 기본적으로 오른쪽 화살표가 필요합니다. .end-btn { margin-top: 2vw; background-color: #DAA521; border: none; width: 15vw; height: 3vw; font-size: 1.5vw; color: #FFFFFF; border-radius: 0.5vw; font-weight: bold; cursor: pointer; } View profile Run code snippetHide resultsExpand snippet 답변1 가장 쉬운 방법은 fontawesome 을 사용하는 것입니다. 무료 버전을 사용하면 다음 코드를 사용할 수 있습니다. View Profile 시작하려면 이메일 주소 만..

카테고리 없음 2020. 8. 20. 23:58

내 이미지를 회전에서 직선으로 만드는 방법 (HTML, CSS, JS,)

질문 내 웹사이트의 홈페이지에는 클릭 할 때까지 '깨진'것으로 보이는 이미지가 있는데, 23도에서 시작하여 0으로 회전하고 거기에 머물기를 원합니다. 어떤 아이디어? 읽기 힘들다면 미안하지만 내가 가지고있는 것은 다음과 같습니다. 관련 CSS : .crossRotate { -webkit-transition-duration: 1s; -moz-transition-duration: 1s; -o-transition-duration: 1s; transition-duration: 1s; -webkit-transition-property: -webkit-transform; -moz-transition-property: -moz-transform; -o-transition-property: -o-transform; t..

카테고리 없음 2020. 8. 20. 23:43

form의 radio button에 커스텀 모양을 지정하려면 어떻게합니까?

질문 암호: Urgency Critical High Medium Low 각 긴급 div가 하나의 옵션으로 집합 적으로 하나의 radio button이 표시됩니다. 이유를 이해할 수 있습니다. 내 button에 라디오 확인란이없고 각 div가 value속성이있는 자체 옵션이되기를 원합니다. 예: 상태 선택 : [사용 가능] [유휴] [방해 금지] 대괄호 []안의 각 항목은 클릭 할 수 있으며 고유 한 값 속성 (예 : 사용 가능 양식 내에서이 작업을 수행하려면 어떻게해야합니까? 감사. 답변1 나는 이것을 예로 참조 할 것을 제안 할 것이다. 나는 이것이 정확히 당신이 찾고있는 것이라고 믿습니다. High Medium Low CodePen 예 찾고있는.

카테고리 없음 2020. 8. 19. 15:12

Flexbox를 사용하여 항목을 나란히 배치하는 방법은 무엇입니까? [복제]

질문 This question already has answers here: Arrange 2 items per row using flexbox (2 answers) Closed 14 days ago. 임 플렉스 상자에별로 익숙하지 않지만 다음이 필요한 결과를 줄 것이라고 가정했습니다. 페이지의 왼쪽을 항목 (카드)에 제공해야하지만 위치는 다음과 같아야합니다. div class="flexContainer"> 다음은 주요 div에 대한 내 수업입니다. .flexContainer{ width: 50%; } .turbineIcons{ background-color:white; margin: 1em; height: 20px; width: 20px; } 페이지 왼쪽에 수직으로 배치 된 모든 항목을 표시합니다. 답..

카테고리 없음 2020. 8. 19. 15:04

브라우저 새로 고침시 특정 열 내용 바꾸기

질문 $(".home").append($(".home .coco").sort(function () { return Math.random() - 0.5; })); .row{margin-bottom: 30px;} A B C D 1 2 3 4 Red Blue Green Black Run code snippetHide resultsExpand snippet 동일한 class (coco)를 가진 다른 열과 임의로 열 내용을 섞습니다. 이제 콘텐츠를 셔플하지만 행을 벗어납니다. 그리고 행에서 열을 제거하십시오. 답변1 .home목록에 .coco항목 만 포함 된 경우 메소드가 작동합니다. 그렇지 않으면 목록이 엉망이 될 것입니다. 여기서 아이디어는 .coco항목의 복사본을 만들고 정렬하고 .home목록을 반복하고 ...

카테고리 없음 2020. 8. 19. 01:40

콘텐츠에 따라 CSS Grid 분수 단위가 변경됩니까?

질문 아래에 코드가 있습니다. 텍스트가 상자에 들어가는 한 완벽하게 작동합니다. 텍스트가 초과 되 자마자 상자를 고정 된 크기로 유지하는 대신 (CSS Grid 열에 따라) 분수 단위를 변경하여 상자 크기를 늘립니다. 이것을 변경하고 분수 단위를 변경하는 메소드가 있습니까? 시작하기 전에 이 예 에서 필드에 맞는 텍스트입니다. 페이지를 새로 고치면 (변경 될 때) 필드에 맞지 않는 텍스트이므로 상자의 크기를 변경하고 전체 레이아웃을 엉망으로 만드는 대신 끝에서 잘 려야합니다. 많은 감사합니다, 아래에 나열된 코드-관련 비트 만 포함하여 대부분이 생략 되었기 때문에 여기에서는 그다지 예쁘지 않습니다. .guild{ margin-bottom:2%; height:12%; width:98%; background..

카테고리 없음 2020. 8. 19. 01:34

저장 button을 클릭하여 출력 텍스트에 편집 상자를 표시하려면 어떻게해야합니까?

질문 저장 button을 클릭하여 출력 텍스트를 편집하려면 어떻게해야합니까? 도움이된다면 제발 .... $(document).ready(function(){ $("#btn").click(function(){ let getVal = $("#inputValue").val(); let button = `Button for ${getVal}` $("#output").html($("#output").html() + " " + getVal + button); }); }); jQuery input value display value Run code snippetHide resultsExpand snippet 답변1 $(document).ready(function(){ $("#btn").click(function(){..

카테고리 없음 2020. 8. 19. 01:29

CSS Grid-열 랩이 마지막 행을 완전히 채 웁니다.

질문 여러 열이있는 CSS Grid가 있습니다. 최소 열 width는 100px입니다. 그런 다음 열을 래핑하고 싶지만 래핑 후 나머지 행과 같은 수의 열을 마지막 행에 넣고 싶습니다. 예를 들어 첫 번째 행에 3 셀, 마지막 행에 1 셀을 원하지 않습니다. 마지막 행 셀을 확장하고 싶지 않지만 마지막 행으로 더 많은 셀을 이동하고 모든 셀을 확장합니다. .grid { display: grid; grid-template-columns: repeat( auto-fit, minmax(100px, 1fr)) } .element { height: 50px; border: 2px solid red; } Run code snippetHide resultsExpand snippet 답변1 대신 플렉스 박스를 사용할 ..

카테고리 없음 2020. 8. 19. 01:25

호버 색상 변경시 CSS는 i 태그에 영향을주지 않습니다.

질문 저는 span과 i라는 2 개의 태그를 포함하는 div를 만들었습니다.색상과 커서를 변경하는 div에 마우스 오버를 추가하려고 시도했지만 i 태그에서는 색상이 변경되지 않습니다. .example { margin: 20px; position: fixed; display: inline; } .example i { border: solid #8690ab; border-width: 0 3px 3px 0; display: inline-block; padding: 3px; transform: rotate(45deg); line-height: 10px; position: relative; top: -15px; } .example span { display: inline-block; padding: 0px; co..

카테고리 없음 2020. 8. 19. 01:22

스택 된 자식을 인식하는 CSS 부모

질문 두 개의 이미지가 서로 겹쳐져 있습니다. 내 솔루션이 작동하고 절대 위치를 사용합니다. 이 접근 방식의 단점은 부모 요소가 자식 경계를 인식하지 못하기 때문에 container를 적용하지 않는다는 것입니다. 부모님이 자녀에게 크기를 자동으로 맞추도록하려면 어떻게해야하나요? Flex 및 Grid 솔루션이 허용되며 절대 솔루션을 포지셔닝합니다. 자바스크립트를 사용하고 싶지 않습니다. container 높이를 수동으로 설정해야하는 솔루션을 해킹하고 싶지 않습니다. 최신 브라우저 (Chrome, Firefox, Opera, Safari 및 Edge)에서 작동하면 괜찮습니다. 오래 전에 Grid와 관련된 솔루션에 대해 읽은 것 같지만 확실하지 않습니다. div { position: relative; back..

카테고리 없음 2020. 8. 19. 01:17

모바일 전용 아코디언 메뉴 bottom 글을 만드는 방법

질문 모바일에서 축소되는 bottom 글을 만들려면 어떻게해야합니까? 실제로 확장하려면 메뉴 제목을 클릭해야합니까? bottom 글 메뉴가 데스크탑에서 정상적으로 보이기를 원합니다. 2. 모바일의 경우 기본적으로 자동으로 축소되고 사용자가 메뉴를 확장하거나 닫을 수있는 옵션이 있습니다. 감사합니다 ! 내 현재 코드 : Legal Shipping Contact Us About Returns Information Privacy Terms Ambassadors Blog Run code snippetHide resultsExpand snippet 답변1 도움이 되었기를 바랍니다. jQuery(".nav-footer h4").click(function(){ jQuery(this).parent(".nav").tog..

카테고리 없음 2020. 8. 19. 01:12

잡동사니

CSS → (73)건