css - svgの使用に関する質問

デザイナーは、SVG と互換性がない場合は提供された PNG 画像を使用し、SVG と互換性がある場合は SVG を使用するように求めました。この互換性の問題について、Zhang Xinxu のブログに次のように書かれていました。 <svg width="96" height="96"<image xlink:href="svg.svg" src="svg.png" width=&quo;

高洛峰 2017-05-16 13:20:43 0  2  885

javascript - svgタグ内の要素の幅と高さをsvgタグの幅と高さに等しくするにはどうすればよいですか?

svg タグは div ボックスで囲まれています。svg の幅と高さは、外側のボックスの幅と高さの 100% に設定されています。このとき、div ボックスの幅と高さを変更します。 svgの要素の幅と高さは常にdivボックスと同じですが、svg内のパスタグは図のように幅と高さが異なります。 svg内の要素の全体の幅と高さを同じにする方法。 SV...

曾经蜡笔没有小新 2017-05-16 13:27:36 0  2  938

JavaScript - SVG初心者、SVGに画像を挿入したい

コードは上記の通りです。SVGに画像を挿入してアニメーションさせたいのですが、効果がありません。説明してください...

代言 2017-06-24 09:44:02 0  1  929

JavaScript - Firefox で svg 要素の高さを取得する方法。

svg 要素の clientHeight と offsetHeight は 0 で、Firefox では未定義ですが、Chrome では正常です。 SVGの高さを取得するにはどうすればよいですか? {コード...}

淡淡烟草味 2017-05-19 10:30:24 0  2  521

ウェブサイト上に変更できないアイコンがあります。助けてください。これは svg で書かれています。

Web サイト上に変更できないアイコンがあります。助けてください。 svg <div class="bar-logo"> <svg xmlns="http://www.w3.org/2000/svg" クラスで記述されています="menu-svg" "> &nb

藍錄_陈炳夷 2018-08-11 13:03:40 0  1  1115

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

この SVG で目がカーソルを追うようにします

このチュートリアルを使用して、SVG の瞳孔をカーソルに追従させようとしています: https://dev.to/anomaly3108/make-svg-follow-cursor-using-css-and-js-2okp 4 つの div があります: left眼球 eyeball_right 生徒左 瞳右 右 JS は動作しているように見えますが、角度はあまり正確ではありません。生徒の位置が高すぎて、正しい位置に留まることはできません。 leteyeball_left=document.quer

P粉969253139 2024-03-27 23:50:02 0  1  415

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

透明性とアニメーションを維持しながら、アニメーション SVG ファイルを Next.js 13 にインポートするにはどうすればよいですか?

Next.js13 にアニメーション SVG ファイルをインポートする importImagefrom"next/image";exportdefaultfunctionHome(){return(<mainclassName="flexh-screenflex-colitems-center"><divclassName="containermt-12flex"

P粉322106755 2024-03-27 13:38:40 0  1  516

Angular で円形の SVG 温度ドラッガーを作成しますか?

これは、Angular で作成しようとしている円形の親指ドラッガーの静的なデモンストレーションです。これは、rinkle-dashoffset="-260" 設定を使用して、親指/ドラッガーを親指の後ろの円形パスの終端近くに配置します。-260 の負のオフセットが期待どおりに機能することがわかります。 <bodystyle="width:200px;height:200px;"><svg(mousedown)="onMouseDo

P粉135799949 2024-04-03 09:33:29 0  1  673

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

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

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

JavaScript - 低バージョンの Chrome およびモバイル端末での SVG フォントのスケーリングの問題。

低バージョンのシェル ブラウザや 360 Extreme Speed などのモバイル ブラウザでは、svg の &lt;tspan&gt; タグ内のフォントを正しく拡大縮小できませんが、最新バージョンの Chrome では正常です。 {コード...} ウィンドウを縮小しても、スピード ブラウザのフォント サイズは 12 ピクセルに拡大縮小されても縮小されません。最新のChromeでは問題なく動作します...

怪我咯 2017-05-16 13:32:50 0  1  750

JavaScript - SVG で点が閉じたパス内にあるかどうかを判断するにはどうすればよいですか?

SVG で点が閉じたパス内にあるかどうかを判断するにはどうすればよいですか?Web ページ上の点の座標がわかったとして、その点がページ全体の不規則なパスの閉じた領域内にあるかどうかを確認するにはどうすればよいですか?

大家讲道理 2017-06-26 10:53:59 0  2  984

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

javascript - vue が HTML に svg ファイルを導入する方法

インターネット上では object 要素を使用できることがわかりますが、404 が報告されるため、パスは間違いなく正しいです。コード：

过去多啦不再A梦 2017-06-28 09:26:52 0  3  995

svgアニメーションとcss3アニメーションの長所と短所は何ですか?

RT、トランジション アニメーション効果はどのような状況で、どのソリューションに適していますか?

曾经蜡笔没有小新 2017-05-16 13:21:17 0  1  685

Reactjs SVG アイコンは同じ CSS にもかかわらずサイズが異なります

私はreactjsを使ってウェブサイトを構築するのは初めてです。私は React Icon Library の ReactJS アイコンを使用しています。これらのアイコンが Web サイトの同じ部分で繰り返される場合、そのサイズは異なります。参考までに写真を添付し​​ます。」 checkを使って確認しました。小さいアイコンのパスは 9.97x9.97 ですが、通常の表示のパスは 14x14 であることを示しています。パスの意味がわからないし、アイコンのサイズが異なる理由もわかりません JSX コードは (例) importReactfrom'react'imp です

P粉184747536 2024-04-01 13:18:38 0  1  534

SVGテキストアイコンが正常に表示できないのですがなぜですか？

クロスオリジン要求のブロック: 同一オリジン ポリシーにより、http://127.0.0.1/bick/public/static/admin/fonts/fontawesome-webfont.woff?v=4.3.0 にあるリモート リソースの読み取りが禁止されています。 (原因: CORS ヘッダー「Access-Control-Allow-Origin」がありません)

展望45º天空 2019-03-04 11:18:53 0  0  1044

JavaScript - Webpack のカスタム属性 md-icon-src がパッケージ化時に変換されない

Vue プロジェクトにコンポーネント {code...} がありますが、npm でビルドを実行すると、md-icon-src がパッケージ化されたパスに変換されません。しかし、webpack.base.conf.js を見ると、svg {code...} をサポートしています。これは、md-icon-src がカスタム属性だからですか?すべき...

阿神 2017-05-18 10:58:30 0  1  732

JavaScript - SVG を使用してこの傾向グラフを実現する方法をデモしてください。

(www.sf.gg) は、中国を代表する開発者テクノロジー コミュニティです。私たちは、プログラミング愛好家に純粋で高品質な技術交流プラットフォームを提供し、開発者と一緒に学び、コミュニケーションし、成長し、開発者の時代を作りたいと考えています。

天蓬老师 2017-05-19 10:44:28 0  3  381