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

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

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

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

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

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

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

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

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

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

HTML、CSS、SVG を使用してスケーラブルな標識を作成する

道標（先端のある長方形）の形のボタンを作成したいと考えています。 _______|\|_______/各テキストの長さが異なるテキストを動的にロゴに書き込みたいと考えています。グラフィックのみを背景グラフィックとして使用してこれを試してみると、矢印はそれに応じて拡大縮小および圧縮/伸縮されます。したがって、これを行う方法は、テキストを通常の div に配置し、CSS:after を使用して矢印を SVG として追加することです。矢印は完全に塗りつぶされているはずです。つまり、フレームの問題に対処する必要はありません。 （見やすくするためにSVGを黒のままにしました）最初の問題は、矢印が常にブロ...

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

背景や透明文字が切れてしまう

CSS を使用して、以下に示すように背景から透明なテキストを切り取る効果を作成する方法はありますか?画像がテキストに置き換わるため、貴重な SEO をすべて失うのは残念です。最初に影を考えましたが、何も思いつきませんでした...画像は Web サイトの背景で、絶対位置の <img> タグです

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

ナビゲーション バーと次のセクションの間の小さな空白スペースを削除するにはどうすればよいですか?ホバーセレクター上の小さな灰色のスペースを取り除くにはどうすればよいですか?

freecodecamp の HTMl コースの最終プロジェクトとしてこの Web サイトをコーディングしているのですが、修正方法がわからない 2 つのエラーが発生しました。一方では、ナビゲーション バーと最初のセクションの間に小さな白い線があります。一方、ホバーセレクターを使用してナビゲーションバーリンクの背景を灰色にしますが、下部に小さな暗い線を残します。白い線は次のようになります。 最初の白い線を修正するために、パディングとマージンを削除してみました (これにより、端の空白の一部が削除されましたが、2 つの部分の間に残った空白は削除されませんでした。また、すべての CSS も追加しました...

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

object-c -transitionWithView が UIView を反転するときにビューの色が薄くなる問題をキャンセルするにはどうすればよいですか?

カードの表裏を反転するようなアニメーションを作りたい場合、UIViewのtransitionWithViewメソッドを使用すると、反転したビューの色が暗くなり、ビューの背景色が白い場合、ちらつきやチラツキが発生します。反転すると中心線が黒くなり、効果が非常に悪いので、アドバイスをお願いします。

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

埋め込みクラスを使用して HTML でさまざまなテキストをレンダリングする方法

コードが埋め込まれているカテゴリに基づいて、つまりカテゴリが .category-rabbitmq の場合に、異なるテキストを表示したいと考えています。カテゴリが .category-rabbitmq の場合、これにより背景を変更できます。 &lt;style&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  485

javascript - 奇妙な問題が見つかりました。タブを閉じると、作成した CSS アニメーションが自動的に一時停止されました。

奇妙な問題が見つかりました。私が作成した CSS アニメーションは、タブを閉じると自動的に一時停止し、タブを展開すると再生し続けます。動きの効果を出すために背景画像を動かして使っているのですが、これと関係があるのでしょうか？

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

固定ヘッダーと回転列ヘッダーを備えた表

固定ヘッダーと固定最初の列を持つテーブルがあります。また、列ヘッダーを 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  507

JavaScript - echarts の凡例に文字が多すぎる場合、それを省略記号に変更するにはどうすればよいですか?

私は現在、凡例が動的に生成される echarts 円グラフを作成しています。場合によっては、12 個以上のテキストが背景に送信され、スタイルが見苦しくなります。今、達成したいのは、1 つの凡例のテキストが 8 個を超えたときです。を選択すると、自動的に省略記号「...」に変わります (下の図を参照)。少し指導してください。

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

2 つの fill.Rect 関数間の衝突を検出します。

1 人のプレイヤーが矢印キーで制御され、もう 1 人のプレイヤーが WSAD キーで制御されるゲームがあります。 600x600 のキャンバスにマップを設定しており、ゲームの塗りつぶしに 2 人のプレイヤー間の衝突を追加したいと考えています。2 人のプレイヤーが特定の半径内にいるとき、プログラムを終了するか、「ゲーム終了」のようなテキストを表示します。これが私の js です。 、HTML および CSS コード (コード スニペットを表示するには、「全画面表示」に移動する必要があります): //Canvasmycan.style.display="block&quo

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

レスポンシブ画像とテキスト Div を並べて表示

そこで、1 つの div が画像で、もう 1 つが背景付きのテキストであるテンプレートを作成しようとしています。次に、このテンプレートをレスポンシブにして、テキストが特定のピクセル幅で画像の下に表示されるようにしたいと思います。 stackoverflow を調べてみると、Flexbox を使用するべきだという投稿が無数にありました。試してみましたが、完全には理解できませんでした。したがって、デスクトップでは次のようになります: https://i.stack.imgur.com/HDehv.jpg スマートフォンでは、ここにジャンプするはずです https://i.stack.im

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

フェードイン/フェードアウトトランジションを備えた CSS マーキー

右端からフェードインし、左端からフェードアウトするテキストを含むCSSマーキーを作成しようとしています。文字の端だけが透明になります。これを「不透明マスク」と呼び、左右の端にぼかします。 CSS マーキーのコード例は見つかりますが、このようなフェードイン/フェードアウト効果を備えたものはありません。また、背景を完全に透明にして、テキストのみにエッジ効果を持たせたいと考えています。コンテナにグラデーションを追加しようとしましたが、後から考えると、それは正しいパスではないようです。以下は私がこれまでに思いついたコードです。助けてください、ありがとう！ @BernardBorg: 2 番目の新しい例...

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

高さ 100vh の背景画像の中央に div を配置します

私は上部に固定位置のナビゲーション バーがあるコースに取り組んでいます。背景の高さは 100vh に設定され、テキスト コンテンツを含む div は背景の中央にあります。 Flexbox を使用するとほぼ中央に配置されますが、実際に背景の中央に配置するには、その div の高さを高さの 100% に設定する必要があります。フレックスボックスとビューポートの高さについてはある程度知っていますが、ダイブを真に中央に配置するには、なぜ div の高さを 100% に設定する必要があるのか​​混乱しています。私が求めていることを再現するには、ここに背景として任意の画像を配置できると思います。私がここに...

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

背景が丸いテキストを画像にオーバーレイする方法

この画像に表示されているものを HTML で複製する必要があります。問題は、テキストが div と背景画像を覆っていることです。外側の div に画像がなく単色もない場合は、角が丸い小さな HTML 要素を適切な場所に配置すれば、これをかなり簡単に実行できると想像できますが、背景画像によってさらに複雑になります。これまでのところ、私はこれを持っています...ご覧のとおり、2つの丸い角で立ち往生しています。誰かが解決策を提案できますか?すべての最新ブラウザで動作する必要があることに注意してください: #outer{width:100%;hei

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

問題 2003 (HY000) を修正する方法: MySQL サーバー 'db_mysql:3306' に接続できません (111)

最近、FastAPIPython サーバーをコンテナ化しようとしました (レプリケーション/二重化の目的でもあります)。以前は、Docker コンテナーに MySQL サーバーだけを入れてすべて問題なかったのですが、Web サーバーもサービスにしたところ、MySQL サーバーに接続できなくなり、アプリケーションが動作しなくなりました。以下は、アプリケーション fromfastapiimportFastAPIimportmysql.connectorapp のサーバー データベース初期化コネクタのコード スニペットです。

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

クエリ制限後のソートを試してみる

それで、これが私の最初の質問です、何か間違っている場合はご容赦ください。制約に基づいて並べ替えクエリを作成しようとしています。つまり、90 個のレコードを持つ Customers テーブルがあります。まず 3 レコードに制限されたクエリを実行し、次にこのクエリの結果を ContactName という列で並べ替えたいと考えています。これはネストされたクエリである可能性があると思います。ネストされたクエリは SQLServer では正常に実行されますが、MySQL で実装する方法がわかりません。制限クエリ: Select*fromcustomerslimit

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

CSS グリッド: 子コンテンツが列幅をオーバーフローした場合に新しい行を作成する

CSS グリッドに基づいた 2 列のレイアウトがあります。 2列目の内容が1frを超えた場合、新しい行を作成したいと思います。現状では、コンテンツが単に列から溢れてしまいます。このレイアウトの要件の 1 つは、右側のメニュー列の項目が 1 行にあることです。これを次のように実行します。 .right-menu{...grid-auto-flow:columndense;...} Grid-auto-flow 属性を削除すると、オーバーフローが停止します。ただし、アイテムは複数の行に積み重ねられており、これは私が望むものではありません。 .riも変換してみました

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