스크롤 가능한 그라데이션 채팅 풍선

다음 예와 같이 아래 그라데이션으로 스크롤할 때 변경되는 그라데이션이 있는 채팅 거품의 흰색 컨테이너를 원합니다. 루트의 배경이 표시되도록 chatBubble 뒤의 .container 부분을 투명하게 만들려고 했습니다. .root{배경색:선형 그라데이션(빨간색, 노란색);너비:100vw;높이:100vh;}.컨테이너{너비:100%;높이:

P粉197639753 2023-09-01 11:52:18 0  2  659

한 가지 색상으로 그려진 텍스트에서 애니메이션 그라데이션으로 부드럽게 전환하는 것이 가능합니까?

페이지에 흰색 텍스트가 있고 그 아래에 버튼이 있습니다. 또한 애니메이션 그라데이션이 적용되어 텍스트를 채웁니다. 버튼을 클릭하면 -webkit-text-fill-color 속성이 투명해지며 텍스트 색상이 그라데이션에 맞게 갑자기 변경됩니다. 이렇습니다: https://codepen.io/hvyjhqnt-the-vuer/pen/poQdaLQ 흰색에서 그라데이션으로 부드럽게 전환하는 것이 가능합니까? (-webkit-text-fill-color 속성은 transiti를 직접 지원하지 않습니다.

P粉762447363 2023-09-16 09:22:05 0  1  814

밝은/어두운 테마의 변수에서는 선형 그래디언트가 작동하지 않습니다.

저는 개인 웹사이트(https://cooperativedoilylivedistro.elliott23.repl.co)를 작업 중입니다. 이 웹사이트에는 선호도에 따라 밝은 테마와 어두운 테마가 있습니다. 문제는 선형 그래디언트를 변수로 설정하면 작동하지 않고 전체 배경이 흰색으로 변한다는 것입니다. 이것이 바로 HTML, CSS, JS입니다. 무슨 일이 일어나고 있는지 알고 싶다면 브라우저에서 웹사이트를 확인하세요. <!DOCTYPEhtml><htmllang="ko"&

P粉190443691 2024-03-29 13:28:10 0  1  353

그라데이션이 있는 테두리 이미지에 테두리 반경을 사용할 수 있나요?

원형 테두리(테두리 반경)가 있는 입력 필드를 디자인하고 해당 테두리에 그라데이션을 추가하려고 합니다. 그라데이션과 원형 테두리를 성공적으로 만들 수 있지만 둘 다 함께 사용할 수는 없습니다. 그라디언트가 없는 둥근 모서리이거나 그라디언트가 있지만 둥근 모서리가 없는 테두리입니다. -webkit-border-radius:5px;-webkit-border-image:-webkit-gradient(선형,00,0100%,from(#b0bbc4),to(#ced9de))

P粉633733146 2023-08-29 12:52:01 0  2  557

CSS 방사형 그래디언트를 SVG 방사형 그래디언트로

CSS http://codepen.io/A973C/pen/hnEaf(신호등의 빛을 의미함)와 같이 SVG에서 방사형 그래디언트를 만들 수 있습니까?red{Background:red;Background-image :radial- 그라데이션(갈색,투명);배경 크기:15px15px;너비:100px;높이:100px;테두리-r

P粉308783585 2023-12-11 15:54:09 0  2  615

테두리 그라디언트는 border-radius와 호환됩니까?

둥근 테두리(테두리 반경)로 입력 상자의 스타일을 지정하고 테두리에 그라데이션 효과를 추가하려고 합니다. 그라데이션과 둥근 테두리를 성공적으로 만들 수 있지만 동시에 둘 다 만들 수는 없습니다. 둥근 모서리가 있지만 그라데이션이 없거나, 그라데이션이 있지만 둥근 모서리가 없습니다. -webkit-border-radius:5px;-webkit-border-image:-webkit-gradient(선형,00,0100%,from(#b0bbc4),to(#ce

P粉824889650 2023-08-21 20:39:38 0  2  495

CSS - 선형 그라데이션이 유효하지 않은 이유는 무엇입니까?

background-color: 선형-그라디언트(아래로, #fc8291, #fa213b); 이 코드 줄은 Chrome 및 Firefox에서 유효하지 않으며 배경색이 표시되지 않습니다. 그러나 background-color: red는 정상적으로 표시될 수 있습니다. 왜?

为情所困 2017-05-16 13:38:09 0  1  1651

CSS 배경 그라데이션이 전체 페이지(스크롤 가능한 콘텐츠 포함)를 덮지 않습니다.

HTML 문서의 CSS 배경 그라데이션에 문제가 있습니다. 선형 그래디언트를 배경으로 사용하고 본문 요소에 설정하는 페이지를 디자인했습니다. 내가 직면한 문제는 스크롤할 콘텐츠가 더 많음에도 불구하고 화면이 처음 끝나는 곳에서 그라데이션이 끝나는 것처럼 보인다는 것입니다. 따라서 아래로 스크롤하면 그라디언트의 두 번째 인스턴스가 처음부터 다시 시작되는 것처럼 보입니다. 이것은 나의 현재 CSS(SCSS) 코드입니다: @importurl('https://fonts.googleapis.com/css2?family=Poppins:wg

P粉506963842 2023-09-12 13:20:09 0  2  695

CSS를 사용하여 그라데이션 애니메이션을 만드는 방법

여러 색상이 포함된 그라디언트를 부드럽게 이동하고 싶은데 애니메이션이 매끄럽지 않은 것이 문제입니다. 매 단계마다 위치가 변경됩니다. <스타일>.animated{폭:300px;높이:300px;border:1pxsolidblack;animation:gra5sinfinite;animation-direction:reverse;-webkit-animation:gra5sinfinite;-web

P粉909476457 2023-09-18 09:47:10 0  2  758

점점 가늘어지는 그라디언트 애니메이션의 부드러운 색상 전환을 달성하는 방법은 무엇입니까?

점점 가늘어지는 그라디언트에 애니메이션을 적용하고 있지만 색상 변경이 충분히 부드럽지 않습니다. 다양한 기사를 살펴봤지만 올바르게 재현할 수 없습니다. 여기에서 내 코드를 찾을 수 있습니다: <style>body{min-height:100vh;display: 플렉스 ;align-items:center;justify-content:center;}.pyramid{폭:500px;높이:500px;배경-이미지:coni

P粉285587590 2023-09-01 16:37:22 0  1  515

android - Android 활동은 맨 위에 있지 않은 컨트롤을 표시합니다.

그라데이션 제목 표시줄을 만든 결과, 시작 페이지에서 홈페이지로 이동할 때 배너 표시줄 아래의 목록이 직접 표시되고, 배너 표시줄은 위로 압착된 후 수동으로 위로 스와이프하여 표시되는 것을 확인했습니다. 최상위 컨트롤을 강제로 표시하는 방법이 있나요?

过去多啦不再A梦 2017-06-29 10:09:38 0  1  913

다시 작성된 제목은 HTML에서 그라데이션 배경으로 자동 채우기 슬라이더를 만드는 방법입니다.

저는 HTML을 가지고 놀면서 그라데이션으로 스스로 채워지는 슬라이더를 만들고 싶지만 이것이 거의 불가능하다고 생각합니다. 몇 시간 동안 조사했지만 답을 찾을 수 없는 것 같습니다. JS가 필요하다고 생각하지만 거기에는 완전히 공백이 있습니다. .slidecontainer{justify-content:center;bottom:0px;margin-left:auto;}.slider{-webkit-appearance:none;appearance:none;borde

P粉715228019 2024-02-03 20:57:38 0  2  502

SVG 경로에 그라디언트를 추가할 수 있습니까?

내 웹사이트에 스크립트에 의해 실행되는 간단한 로딩 표시기를 추가하고 싶습니다. 사용자가 기다리는 동안 그라데이션과 회전이 포함된 간단한 호여야 합니다. 아직 애니메이션 부분을 시도하지 않았지만 지금은 정적 스타일이 붙어 있습니다. 이것이 내가 지금까지 얻은 것입니다: <svgversion="1.1"baseProfile="full"xmlns="http://www.w3.org/2000/svg"width=&quo

P粉402806175 2023-10-18 14:55:02 0  2  649

동일한 요소에 두 개의 선형 그라데이션 배경을 추가하는 방법 - Tailwind Tutorial

Tailwind에서 하나의 요소에 두 개의 선형 배경을 추가할 수 있나요? 유효한 CSS 코드는 다음과 같습니다. background-image:linear-gradient(toright,#f8fafb50%,#16161650%),linear-gradient(toright,#16161650%,#f8fafb50%); 다음과 같이 두 번 추가해 보았습니다. ="bg-그라디언트-to-rfrom-w

P粉561438407 2024-03-27 08:57:02 0  1  442

-webkit-mask 내부에서 방사형 그라데이션을 사용하여 3개의 투명한 구멍을 만들고 이미지를 유지하는 방법

저는 프로젝트를 진행 중이며 투명하게 만들기 위해 테두리에 임의의 구멍 3개가 있어야 하는 div를 만들어야 합니다. 내가 직면하고 있는 문제는 2개의 구멍에 대해 방사형 그래디언트와 함께 -webkit-mask를 사용하여 20px의 2개의 투명한 구멍을 생성한다는 것입니다. 내 질문은 세 번째 구멍을 만들려고 할 때입니다. 이 작업을 수행하는 방법을 아는 사람이 있습니까? <divid="pulseAd"class="fadeInUpanimated"style="디스플레이

P粉810050669 2023-09-02 21:32:42 0  2  658

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

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

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

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

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

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

쿼리 제한 후 정렬 실험

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

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

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

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

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

AND, OR 및 NOT 연산자를 사용한 PHP 전체 텍스트 검색 기능

초보자 질문: PHP와 eloquent를 사용하여 검색 문자열에 대한 전체 텍스트 검색을 구현하려고 합니다. $searchstring="+(피해자)+범죄-covid";$searchresult=RssItem::whereRaw("MATCH(description)AGAINST('$searchstring'INBOOLEANMODE)")->ge

P粉076987386 2023-09-05 15:06:32 0  1  577