ClipPath를 사용하여 병에 색상을 채우는 방법

병 이미지가 있고 이 병을 특정 색상으로 채우려고 합니다. 채우기 좌표를 찾았지만 병 내부의 배경이 채워지지 않았습니다.item{width:150px;height:150px;}#tubeLiquid{ background-color: #74ccf4 ;클립 경로:다각형(45%19%,41%22%,41%29%,41%36%,41%43%,41%50%,41%57%,41%63%,41 %70%,41%77%,

P粉690200856 2023-09-09 14:53:51 0  2  560

javascript - 각 공의 배경 이미지가 다르도록 캔버스에 여러 공을 그리는 방법이 가능합니까?

질문: 캔버스에 여러 개의 공을 그릴 때 각 공의 배경 이미지를 다르게 만들 수 있나요? 지금 하고 싶은 일은 공마다 색깔을 다르게 만들어서 그림으로 채우고 싶은 것입니다. 코드의 일부: {code...} 현재 효과:

大家讲道理 2017-06-14 10:54:28 0  4  1037

CSS 애니메이션 이름의 구체적인 의미는 애니메이션의 채우기 모드를 나타냅니다.

최근에 CSS를 사용하여 특정 클래스의 불투명도가 0%에서 100%로 바뀌는 애니메이션을 만들려고 했습니다. 하지만 class="bar" 애니메이션에서 몇 가지 문제가 발생했습니다. animation-fill-mode는 타이틀 애니메이션(불투명도 변경)뿐만 아니라 바 애니메이션에도 적용된다는 것을 알 수 있습니다. animation-fill-mode의 애니메이션 이름을 지정하는 방법이 있나요? 제가 만드는 데 사용한 코드는 다음과 같습니다. @keyframestitle{from{-we

P粉441076405 2023-09-13 10:16:28 0  1  578

css3 - 배경색 대신 CSS 글꼴 스타일과 채우기 색상 추가

다음과 같은 글꼴 스타일이 있습니다. 전체 스팬이 하트를 감싸는 대신 하트에 색상을 추가하려는 경우 색상 오류는 다음과 같습니다. 스팬의 정의는 다음과 같습니다. {코드...} 배경색을 추가하면 위의 그림이 나타납니다. 색상을 직접 사용하면 하트 모양의 테두리만 색칠됩니다.

天蓬老师 2017-06-08 11:02:27 0  2  1297

HTML, CSS 및 SVG를 사용하여 확장 가능한 표지판 만들기

표지판(팁이 있는 직사각형) 형태의 버튼을 만들고 싶습니다. ________|\|_______/각 텍스트의 길이가 다른 텍스트를 로고에 동적으로 쓰고 싶습니다. 그래픽만 배경 그래픽으로 사용하여 이 작업을 시도하면 그에 따라 화살표의 크기가 조정되고 압축/늘어납니다. 따라서 이를 수행하는 방법은 텍스트를 일반 div에 넣고 CSS:after를 사용하여 화살표를 SVG로 추가하는 것입니다. 화살표는 완전히 채워져야 합니다. 즉, 프레이밍 문제를 다룰 필요가 없습니다. (가시성을 높이기 위해 SVG를 검정색으로 남겨 두었습니다.) 첫 ...

P粉555682718 2024-03-31 14:45:14 0  1  498

배경과 투명 텍스트가 잘립니다.

CSS를 사용하여 아래와 같이 배경에서 투명한 텍스트를 잘라내는 효과를 만드는 방법이 있나요? 이미지가 텍스트를 대체하기 때문에 귀중한 SEO를 모두 잃는 것은 부끄러운 일입니다. 처음에 그림자를 생각했는데 아무것도 생각이 안나네요... 이미지는 웹사이트 배경, 절대 위치의 <img> 태그입니다

P粉439804514 2024-03-25 16:47:36 0  2  636

탐색 표시줄과 다음 섹션 사이의 작은 공백을 어떻게 제거할 수 있나요? 호버 선택기에서 작은 회색 공간을 제거하는 방법은 무엇입니까?

freecodecamp의 HTML 과정을 위한 최종 프로젝트로 이 웹사이트를 코딩하고 있는데 해결 방법을 모르는 두 가지 오류가 발생했습니다. 한편으로는 탐색 표시줄과 첫 번째 섹션 사이에 작은 흰색 선이 있습니다. 반면에 저는 탐색 모음 링크의 배경을 회색으로 만들기 위해 호버 선택기를 사용하지만 여전히 하단에 작고 어두운 선을 유지합니다. 흰색 선은 다음과 같습니다. 첫 번째 흰색 선을 수정하기 위해 패딩과 여백을 제거해 보았습니다(이로 인해 가장자리의 공백이 일부 제거되었지만 두 부분 사이에 남아 있는 공백은 제거되지 않았습니...

P粉764836448 2024-02-25 22:54:59 0  1  409

목표-c - TransitionWithView가 UIView를 뒤집을 때 뷰의 색상 어둡게 하기 문제를 취소하는 방법은 무엇입니까?

카드의 앞면과 뒷면을 뒤집는 것과 유사한 애니메이션을 만들고 싶다면 UIView의 TransitionWithView 메서드를 사용하면 뒤집힌 뷰의 색상이 어두워집니다. 뷰의 배경색이 흰색인 경우 깜박임이 발생하고 뒤집을 때 검은색 중심선이 나타납니다. 효과가 매우 나쁩니다. 조언을 부탁드립니다.

三叔 2017-06-21 10:11:50 0  1  1107

포함된 클래스를 사용하여 HTML에서 다양한 텍스트를 렌더링하는 방법

코드가 포함된 카테고리/카테고리에 따라 다른 텍스트를 표시하고 싶습니다(예: 카테고리가 .category-rabbitmq인 경우). 카테고리가 .category-rabbitmq인 경우 배경을 변경할 수 있습니다. &lt;스타일&gt;.category-rabbitmq{배경-이미지:url('https://www.nastel.com/wp-content/uploads/2022/04/nastel_n

P粉418214279 2023-09-02 10:34:50 0  1  494

javascript - 이상한 문제를 발견했습니다. 탭을 닫으면 제가 작성한 CSS 애니메이션이 자동으로 일시중지됩니다.

이상한 문제를 발견했습니다. 제가 작성한 CSS 애니메이션이 탭을 닫으면 자동으로 일시정지되고, 탭을 펼치면 계속 재생됩니다. 움직이는 효과를 얻기 위해 배경 이미지를 사용하는 것도 이와 관련이 있나요?

给我你的怀抱 2017-06-30 09:52:30 0  1  879

고정 헤더와 회전된 열 헤더가 있는 테이블

고정된 헤더와 고정된 첫 번째 열이 있는 테이블이 있습니다. 또한 열 머리글을 45도 회전하고 싶습니다. 고정 제목에는 배경색을 설정해야 합니다. 그러나 다음 열의 배경이 이전 열의 텍스트와 겹치기 때문에 45도 회전된 헤더에 문제가 발생합니다. 다음은 문제의 예입니다. .fixed_table{white-space:nowrap;margin:0;border:none;border-collapse:separate;border-spacing:0;table-layout:

P粉762730205 2024-04-03 08:50:32 0  1  531

javascript - 전자차트 범례에 문자가 너무 많을 때 줄임표로 바꾸는 방법은 무엇입니까?

이제 범례가 동적으로 생성되는 echarts 원형 차트를 만들고 있습니다. 때로는 12개 이상의 텍스트가 배경으로 전송되고 스타일이 보기 흉합니다. 이제 단일 범례의 텍스트가 8을 초과하는 경우를 달성하고 싶습니다. , 자동으로 "..." 줄임표로 변경됩니다(아래 그림 참조). 몇 가지 안내를 부탁드립니다.

过去多啦不再A梦 2017-05-19 10:19:29 0  3  746

두 fill.Rect 함수 간의 충돌을 감지합니다.

한 플레이어는 화살표 키로 제어하고 다른 플레이어는 WSAD 키로 제어하는 ​​게임이 있습니다. 600x600 캔버스에 지도가 설정되어 있고 게임 채우기에서 두 플레이어 사이에 충돌을 추가하고 싶습니다. 두 플레이어가 특정 반경 내에 있을 때 프로그램을 종료하거나 "Game End"와 같은 텍스트를 표시하십시오. 여기에 내 js가 있습니다. , Html 및 Css 코드(코드 조각을 보려면 "전체 화면"으로 이동해야 함): //Canvasmycan.style.display="block&am...

P粉145543872 2023-09-15 13:26:06 0  1  869

반응형 이미지와 텍스트 Div를 나란히 배치

그래서 하나의 div는 이미지이고 다른 하나는 배경이 있는 텍스트인 템플릿을 만들려고 합니다. 이제 텍스트가 특정 픽셀 너비의 이미지 아래에 있도록 이 템플릿을 반응형으로 만들고 싶습니다. stackoverflow를 거치면서 Flexbox를 사용해야 한다는 글을 수없이 보았습니다. 노력했지만 제대로 할 수 없었습니다. 따라서 데스크톱에서는 다음과 같아야 합니다: https://i.stack.imgur.com/HDehv.jpg 스마트폰에서는 여기로 점프해야 합니다 https://i.stack.im

P粉005134685 2024-04-02 08:59:38 0  1  515

페이드 인/페이드 아웃 전환이 포함된 CSS 선택 윤곽

오른쪽 가장자리에서 페이드 인되고 왼쪽 가장자리에서 페이드 아웃되는 텍스트로 CSS 선택 윤곽을 만들려고 합니다. 글자의 가장자리만 투명해져야 합니다. 나는 이것을 "불투명 마스크"라고 부르고 왼쪽/오른쪽 가장자리에 페더를 적용합니다. CSS 선택 윤곽 코드 예제를 찾을 수 있지만 이와 같은 페이드 인/아웃 효과는 없습니다. 또한 배경은 완전히 투명하고 텍스트에만 가장자리 효과가 있기를 원합니다. 컨테이너에 그라데이션을 추가하려고 시도했지만 돌이켜보면 올바른 경로가 아닌 것 같습니다. 아래는 지금까지 제가 생각해낸...

P粉659516906 2024-03-27 21:24:13 0  2  576

높이가 100vh인 배경 이미지의 중앙에 div를 배치합니다.

저는 상단에 고정 위치 네비게이션 바가 있는 강좌를 진행하고 있습니다. 배경의 높이는 100vh로 설정되고 텍스트 내용이 있는 div는 배경 중앙에 있습니다. Flexbox를 사용하면 거의 중앙에 배치되지만 실제로 배경 중앙에 배치하려면 해당 div의 높이를 높이의 100%로 설정해야 합니다. Flexbox와 뷰포트 높이에 대해 알고 있지만 다이빙의 중심을 정하기 위해 div의 높이를 100%로 설정해야 하는 이유가 무엇인지 혼란스럽습니다. 제가 요구하는 것을 복제하기 위해 여기에 배경으로 어떤 이미지든 넣을 수 있다고 생각합니다....

P粉006847750 2024-02-17 12:39:44 0  1  432

둥근 배경의 텍스트로 이미지를 오버레이하는 방법

이 이미지에 표시된 내용을 HTML로 복제해야 합니다. 문제는 텍스트가 div와 배경 이미지를 덮고 있다는 것입니다. 외부 div에 이미지가 없고 단색이 없다면 둥근 모서리가 올바른 위치에 배치된 일부 작은 html 요소를 사용하여 이 작업을 상당히 쉽게 수행할 수 있다고 상상할 수 있지만 배경 이미지가 복잡함을 더합니다. 지금까지 나는 이것을 가지고 있습니다... 보시다시피, 나는 두 개의 둥근 모서리에 붙어 있습니다. 누구든지 해결책을 제안할 수 있나요? 모든 최신 브라우저에서 작동해야 합니다. #outer{width:100%;...

P粉328911308 2023-08-30 15:20:14 0  1  516

문제 2003(HY000) 해결 방법: MySQL 서버 'db_mysql:3306'에 연결할 수 없습니다(111).

최근에 FastAPIPython 서버를 컨테이너화하려고 했습니다(복제/배가 목적으로도). 이전에는 Docker 컨테이너에 MySQL 서버만 있으면 모든 것이 괜찮았지만 웹 서버도 서비스로 만들었을 때 MySQL 서버에 연결할 수 없어 이제는 애플리케이션이 작동하지 않습니다. 다음은 fromfastapiimportFastAPIimportmysql.connectorapp 애플리케이션에 있는 서버 데이터베이스 초기화 커넥터의 코드 조각입니다.

P粉178132828 2023-09-05 11:18:47 0  1  899

쿼리 제한 후 정렬 실험

이것이 나의 첫 번째 질문입니다. 문제가 있으면 용서해 주십시오. 제약 조건을 기반으로 정렬 쿼리를 만들려고 합니다. 따라서 90개의 레코드가 있는 Customers 테이블이 있습니다. 먼저 3개의 레코드로 제한된 쿼리를 수행한 다음 ContactName이라는 열을 기준으로 이 쿼리의 결과를 정렬하려고 합니다. 내 생각에 이것은 중첩된 쿼리일 수 있습니다. 중첩 쿼리는 SQLServer에서 잘 실행되지만 MySQL에서 구현하는 방법을 모릅니다. 제한 쿼리: Select*fromcustomerslimit

P粉237125700 2023-09-05 14:46:42 0  1  780

CSS 그리드: 하위 콘텐츠가 열 너비를 초과할 때 새 행 생성

CSS 그리드를 기반으로 하는 두 개의 열 레이아웃이 있습니다. 두 번째 열의 내용이 1fr을 초과하면 새 행을 만들고 싶습니다. 현재로서는 내용이 단순히 열을 넘치게 됩니다. 이 레이아웃의 요구 사항 중 하나는 오른쪽 메뉴 열의 항목이 한 행에 있어야 한다는 것입니다. .right-menu{...grid-auto-flow:columndense;...}를 사용하여 이를 달성합니다. Grid-auto-flow 속성을 제거하면 오버플로가 중지됩니다. 그러나 항목이 이제 여러 행으로 쌓여 있어 내가 원하는 것이 아닙니다. .ri 변환도 ...

P粉212114661 2023-09-05 15:18:28 0  1  658