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  610

Vue はカラー SVG ファイルを動的に塗りつぶします

VueJS3を使用してTwitterのクローンアプリを作成しています。 Twitter のロゴを .svg ファイルとして保存し、<img/> タグで使用できるようにしました。 <svg> タグに fill="#fff" 属性を指定すると、その色を変更することもできます。ただし、この .svg ファイルを複数の場所で異なる色で使用したいと考えています。そこで、 <img/> タグにクラス fill-white、bg-whit を指定して試しました

P粉125450549 2024-01-03 22:39:20 0  2  752

SVG - 複数のグラデーション塗りつぶしのある醜いエッジ

JavaScript カラーピッカーを作成したいと考えています。 SVG を使用して、次のような色の三角形を作成しています。 body{background:black;}<svgxmlns="http://www.w3.org/2000/svg"width="88"height="88"class= 「彩度-明るさ」&

P粉937769356 2024-04-01 20:00:27 0  1  466

SVGをインラインでロードして塗りつぶしの色を変更する

SVG は次のように使用します。<imagex="0"y="0"width="40"height="40"href="/resource.svg"></image>これは resource.svg です。<? xmlversion=" 1.0"encoding="UTF-8&qu"

P粉323224129 2024-04-02 13:32:42 0  1  501

<svg> 要素を使用してひし形の形状を作成するにはどうすればよいですか?

HTML5 要素を使用してひし形の形状を作成しようとしています。点を指定したのですが、ひし形に塗りつぶされるのではなく、一対の三角形に塗りつぶされてしまいました。これが私のアプローチです: <div><svgwidth="2000"height="2000"><polygonpoints="2525,7525,5050,500"style="fill:blue;strok

P粉043295337 2023-08-26 12:41:30 0  1  561

グリッドコンテナに行ではなく列を埋めるようにする

グリッドを次のように垂直方向に塗りつぶしたい: 147258369...任意の追加行数. 代わりに、次のように水平方向に塗りつぶします: 123456789 グリッド内の行数ではなく列数を指定したい。インライン CSS スタイルを使用すると、私の div は次のようになります: <divstyle="display:grid;grid-template-columns:1fr1fr1fr;"><div

P粉551084295 2023-08-27 20:59:46 0  1  546

CSS アニメーション名の具体的な意味は、アニメーションの塗りつぶしモードを指します。

最近、CSS を使用して、特定のクラスの不透明度が 0% から 100% になるアニメーションを作成してみました。しかし、class="bar" のアニメーションでいくつかの問題が発生しました。 anime-fill-mode はタイトル アニメーション (不透明度を変更します) だけでなく、バ​​ー アニメーションにも適用されることがわかります。アニメーションフィルモードにアニメーション名を指定する方法はありますか?作成に使用したコードは次のとおりです。 @keyframestitle{から{-私たち

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

css3 - CSS フォント スタイルに背景色の代わりに塗りつぶし色を加えたもの

次のようなフォント スタイルがあります。 ハートを包むスパン全体ではなく、ハートに色を追加したい場合、カラー エラーは次のようになります。 スパンの定義は次のとおりです。 {code...}背景色を追加すると、上の画像が表示されます。効果としては、直接色を使用すると、ハート型の境界線にのみ色が付きます。

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

CSS を使用して、行で折り返されたテキストの塗りつぶし効果を実現します。

ここに最小限の例があります: https://codepen.io/cpcpcpcpcpx/pen/VwZWoyJ、次の内容: .wrapper{width:200px;}h1{font-size:32px;font-family:Tahoma,Helvetica, sans -serif;line-height:50px;}.header-text{background:#aabbcc;padding-

P粉969666670 2023-08-25 00:09:03 0  2  586

React を使用した HTML の SVG パス セレクター

ユーザーがSVGをアップロードできるペイントアプリケーションを作成しています。さまざまな色で塗りつぶし、SVG 上に描画してから消去します。しかし、残念ながらSVGのパスを取得できません。以下は SVG 画像です。ホバーした場合、そのホバー パスのパスを取得し、選択した色で塗りつぶしたいだけです。 Canvas パスと SVG パスを試してみました。しかし、運がありません。 Canvas には beginPath メソッドがあり、SVG を描画するために使用します。 <?xmlversion='1.0'encoding='utf-8'?&

P粉566048790 2023-09-01 23:22:48 0  1  662

部分的に塗りつぶされたボードを示す Typescript の数独問題

練習用に js 数独ジェネレーターを ts ジェネレーターに変換することに成功しましたが、唯一の問題は完全な数独ボードのみを出力するようにする方法です。現在は、ディスクが完了しているかどうかに関係なく出力されるため、正しいディスクが表示されるまで更新する必要があります。完全なボードのみを出力する次の関数の書き方がわかりません: functionfillBoard(puzzleArray:number[][]):number[][]{if(nextEmptyCell(puzzleArray).colInd

P粉135799949 2023-09-08 00:14:34 0  1  592

object-c - ios は写真の RGB カラーを取得し、アルゴリズムを使用して、取り出す必要があるグラフィックを描写し、新しい写真を生成します。

ユーザーが写真を撮ると、アプリは写真の RGB を検出し、必要なブロックを取り出します。次に、写真の撮影後に RGB 補正アルゴリズムを使用して写真の色を塗りつぶします。色かぶりを検出し、RGB Convert to Lab を使用します。次に、Lab を使用して、どの色に偏差があるかを調べます。具体的には...

迷茫 2017-05-02 09:29:03 0  3  875

SVG 円のストローク長をプログラムで変更する

Inkscape で円を作成し、塗りつぶしをオフにしてストロークのみが表示されるようにし、開始点を 45 度、終了点を 315 度に設定しました。次に、90度回転させて、これが最終結果です。 <?xmlversion="1.0"encoding="UTF-8"?><!--CreatedwithInkscape(http://www.inkscape.org/)--><svgw

P粉788571316 2024-03-28 17:03:28 0  2  422

白色の 8 分の 1 を塗りつぶしたい場合、コードをどのように書き直せばよいでしょうか?

題して

狗妻你好 2018-01-15 10:32:03 0  2  1704

javascript - vue keep-alive はどのように複数のパラメータを運ぶのですか?

1つのパラメータを運ぶ場合に有効になりますが、複数のパラメータを運ぶにはどうすればよいでしょうか?

世界只因有你 2017-05-19 10:13:18 0  1  563

書き直されたタイトルは次のとおりです: 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  575

React JSXでハンバーガーメニューをページ全体に合わせる方法

私は Reactjsx を初めて使用します。Tailwind を使用していますが、これは非常に優れています。私もやりながら勉強中です。それで、私のナビゲーションではハンバーガーメニューを表示することができますが、その表示方法が好きではありません。ページ全体が白で塗りつぶされていることを確認しようとしています。下の 2 番目の画像を参照してください。これは私が達成できたことですが、達成したいことはあまりきれいではないと思います、またはそのようなもので、サイト全体を白で塗りつぶし、オプションを表示してください。私の質問は、私のコードについてです。どうすればできるでしょうか。私がそれを実現しますか？...

P粉368878176 2023-08-31 14:31:09 0  1  749

javascript - 各ボールの背景画像が異なるようにキャンバス上に複数のボールを描画するにはどうすればよいですか?可能ですか?

質問: キャンバス上に複数のボールを描画する場合、各ボールの背景画像を異なるようにするにはどうすればよいですか? 可能ですか?私が今やりたいのは、それぞれのボールを異なる色にして、そのボールを写真で塗りつぶしたいということです。コードの一部: {code...} 現在の効果:

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

JavaScript - 画像をブラウザに読み込むと、画像の周囲のピクセルがぼやけるのはなぜですか?

1000px*1000pxの画像を作成し、最初のピクセルに塗りつぶしの色を付けました。Windowsでズームインした後、通常のフロントエンドはこの画像を要求し、スタイルを設定しました: width: 40000px; height: 40000px; 何度もズームインした後、周囲のピクセルが非常にぼやけていて、どれだけ拡大しても、提示するものは常にあるべきだと感じています...

高洛峰 2017-05-19 10:34:48 0  3  598

angular.js - AngularJS+Laravel を使用して Web サイトを構築することによって引き起こされるルーティングの問題

私は 1 か月以上 AngularJS を学習してきましたが、AngularJS は双方向のデータ バインディング、命令、モジュール化、MVC 設計パターンにより、フロントエンド開発のコード量が大幅に削減されるだけでなく、非常に使いやすいことがわかりました。テストも容易になります。 AngularJS を学ぶ前に、私も学びました...

漂亮男人 2017-05-15 16:50:34 0  4  683