So fügen Sie einem Bild mithilfe von CSS mehrere transparente Überlagerungen hinzu

Wie kann ich auf das Dreieck drücken und den Inhalt über dem weißen Kreis einfügen? Ich versuche eine Lösung zu finden, um einen Heldenabschnitt mit einem Hintergrundbild zu erstellen, das drei Überlagerungsformen als Teil des Bildes enthält. Oben auf der Überlagerung befinden sich h1, p und btn. Ic...

P粉777458787 2024-02-25 17:09:14 0  1  423

Das Transformieren und Filtern von Bildern führt zu einer Überlagerung

Ich habe einen Code gefunden, der die Größe des Bildes erhöht, wenn man mit der Maus darüber fährt, und das Bild mit der Maus nicht von anderen Bildern beschnitten wird: Tutorialsrepublic.com Aber wenn ich auch diesen Code eingebe: img{transition:filter.5sease-in -out ;-webkit-filter:grayscale(100 %...

P粉276876663 2023-09-15 20:58:43 0  1  1016

Halten Sie das Overlay-Bild innerhalb der Bildgrenzen – beschränken Sie es so, dass es nur am Bild haftet

Ich versuche, ein Overlay über ein Bild zu legen, aber dieses Overlay erstreckt sich bis zur oberen Menüleiste und ich weiß nicht, wie ich es einfach in das Bild einfügen soll. Ich habe verschiedene Möglichkeiten ausprobiert, die Größe des Bildes zu ändern und die Position zu ändern, aber es erstrec...

P粉838563523 2023-09-20 22:57:13 0  1  614

Bild wird nicht auf Seite geladen

Ich möchte Schiebebilder in eine Webanwendung laden und verwende dafür Bootstrap-Karussell. Holen Sie sich Bilder vom Hintergrund. Bilder werden im Bildzustand gespeichert. Nachfolgend finden Sie das JSON-Format zum Abrufen der Daten. images:[{SNO:'1',NAME:'image.jpg',PIC_NAME:'image'}] Nach dem Hoc...

P粉238433862 2023-09-09 20:59:03 0  1  581

Wie kann ich vor dem Laden Platz für ein Bild variabler Größe reservieren, um Layoutänderungen zu verhindern?

Ich habe eine HTML-Seite, die Text, ein Bild-Tag und etwas Text wie diesen enthält: Dies ist der Text vor dem Bild. <imgsrc="image.jpeg"/>Dies ist der Text nach dem Bild. Wenn die Seite nun geladen wird, wird der Text vor den Bildern geladen, da das Laden der Bilder länger dauert. Da...

P粉936509635 2023-08-28 00:04:44 0  1  593

Das WebPack-Bild wird nicht mit dem Dateiladeprogramm geladen

Derzeit habe ich ein Webpack5-Projekt, das mehrere SVG-Bilder und ein Hintergrundbild erfordert. Das SVG-Bild ist in der Datei template.html codiert. Auf das Hintergrundbild wird in der Datei style.css verwiesen. Wenn ich den Build ausführe, werden keine Bilder auf der Webseite erstellt. Sie bleiben...

P粉513318114 2024-03-19 19:54:32 0  1  268

Die Bildgröße überschreitet das Containerlimit

Ich habe den folgenden Screenshot gepostet, der zeigt, wie ein Bild die Grenzen seines Containers überschreitet, während die anderen Bilder korrekt gestapelt sind. Ich habe noch nichts in CSS gemacht. Geben Sie hier die Bildbeschreibung ein. Ich habe speziell versucht, die maximale Breite für dieses...

P粉083785014 2023-08-14 20:13:56 0  1  554

Betten Sie angehängte Bilder in HTML-E-Mails ein

Wenn ich ein Bild an eine E-Mail anhänge, wie platziere ich es im HTML-Inhalt? Ich habe versucht, nur den Dateinamen als Bildquelle zu verwenden, aber das scheint nicht zu funktionieren.

P粉285587590 2023-08-24 18:08:00 0  2  521

Bild über die Funktion onclick() ändern

Ich möchte ein Bild in ein anderes ändern, wenn ich auf das Objekt klicke. Der Code ist in der folgenden Reihenfolge gestapelt: Ich möchte, dass das Bild beim Klicken durch eine farbige Version des Bildes, also ein anderes Bild, ersetzt wird. Jetzt weiß ich, dass ich es mit JQuery/JS machen kann. Ab...

P粉242535777 2023-08-18 08:53:28 0  1  480

Wie lade ich dynamische Bilder von einer URL in Nuxt3?

Ich habe eine Nuxt3-Komponente, die ein dynamisches Bild, das ich von einer bestimmten URL (Auth0-Bild) erhalte, nicht laden kann. Meine Vorlage sieht so aus: <template><imgclass="h-28w-28rounded-fullborder-4border-blackbg-gray-300":src="image"alt=""/><p&...

P粉236743689 2023-08-30 10:17:55 0  1  565

Exportieren/laden Sie Mapbox-Karten mit Overlays und Markierungen aus HTML herunter

Ich möchte eine HTML-Seite erstellen, auf der Kunden ihre personalisierten Karten erstellen können. Ich habe Mapbox verwendet, um dies zu erstellen. Über dieser Karte befindet sich ein Overlay, und Kunden können auch Markierungen auf der Karte platzieren. Aber ich habe mit zwei großen Problemen zu k...

P粉459578805 2024-03-29 11:15:04 0  1  481

javascript - Beim Erstellen eines gestapelten Säulendiagramms in Echarts ist ein Problem aufgetreten. Bitte geben Sie mir eine Anleitung.

1. Säulendiagramme sind gestapelt und alle Daten haben eine Bildanmerkung, aber ich verstehe die Positionierung und Anzeige nicht. Ich habe gerade Echarts 2 verwendet. Jede Serie.Daten im roten Kreis muss einen Detailrahmen anzeigen. Kann nur Markpoint verwendet werden? Wird diese Anforderung erfüll...

PHP中文网 2017-05-19 10:39:11 0  2  606

Tipps zum Laden ionischer Bilder

Ich spiele nur mit Ionic und Vue3 herum. Wenn ich jedoch das ion-img-Tag verwende, werden die aus dem Assets-Ordner geladenen Bilder nicht korrekt angezeigt. Ordnerstruktur: -assets--logo.svg-views--Authentication.vue Wenn ich das Bild mit Standard-HTMLimg lade, funktioniert es einwandfrei, aber nic...

P粉416996828 2023-08-26 20:03:50 0  1  586

Filepond fügt vor dem Rendern des Bildes einen Authentifizierungsheader hinzu

Ich verwende das Filepond-Plugin in meiner Vue-Anwendung. Es passt perfekt zu meinen Bewerbungsanforderungen. Derzeit stellt mein Backend-Dienst Bilder über die JWT-Authentifizierung bereit. Wie füge ich einen benutzerdefinierten Header zum Dateipool hinzu, um Bilder in die Komponente zu laden? Folg...

P粉201448898 2024-03-27 13:06:23 0  1  432

So fügen Sie Bilder zu einer JavaScript-Quizanwendung hinzu

Ich versuche, Bilder zu einer JavaScript-Quiz-App hinzuzufügen, habe aber alles versucht und das „imgsrc“-Attribut auf verschiedene Arten hinzugefügt, aber nichts scheint zu funktionieren ... Bitte helfen Sie, dass es für ein Projekt funktioniert, das erledigt werden muss. Das ist mein Code... const...

P粉333186285 2024-02-03 20:47:02 0  1  363

Das Seitenverhältnis des Bildes im Bild

Ich habe ein Bild mit einem Titel wie diesem: Titel Ich habe auch img{max-width:100%} in CSS. Ich möchte die Breite und Höhe eines Bildes gleichzeitig festlegen und dessen Seitenverhältnis beibehalten, wenn die Breite unter den eingestellten Wert fällt. Also habe ich Code wie diesen ausprobiert: Tit...

P粉557957970 2023-08-17 20:24:04 0  1  483

Wie erstelle ich mit Highcharts ein gestapeltes Donut-Diagramm (Kreisdiagramm) in Vue.js?

Ich möchte mit Highcharts ein Donut-Diagramm erstellen, kann dieses Diagramm jedoch nicht in eine gestapelte Form konvertieren. Der Vue.js-Code lautet wie folgt: <template><div><b-colmd="12"style="margin-top:40px"><highcharts:options="pieChartOptions&quo...

P粉980815259 2024-03-19 19:17:54 0  1  482

Fügen Sie der Eigenschaft „Hintergrundbild' im Body-Tag eine Animation hinzu: Schritt-für-Schritt-Anleitung

Ich verwende ein Hintergrundbild im Style-Tag. <style>body{background-image:url("img.jpg");background-size:cover;transition:background-image4slinear;}</style>Ich möchte, dass das Bild eingeblendet wird, ohne der Seite ein separates Div hinzuzufügen . Kann dieses Ziel erreicht w...

P粉347804896 2024-03-29 21:59:19 0  2  439

Möchten Sie mehrere Bilder ändern, indem Sie in einem Modal auf die Bilder klicken?

Ich verwende gsap.js für das Popup/Modal. Ich verwende forEach, damit es einwandfrei funktioniert, egal wie viele identische Teile ich dieser Website hinzufüge. Mein einziges Ziel ist es, dass das jetzt irgendwie perfekt funktioniert. Immer wenn Sie auf die „Schaltfläche“ klicken, die angezeigt wird...

P粉269530053 2024-01-29 09:35:00 0  1  380

So fügen Sie einem Bild mit dem Elementor-Editor abgerundete Ecken hinzu

Das macht mich verrückt. Ich habe ein Bild in einem Textfeld auf einer einfachen Elementor-Seite. Es passt gut in das „Texteditor-Widget“ und ich möchte abgerundete Ecken hinzufügen. Ich habe unter „Site-Einstellungen/Benutzerdefiniertes CSS“ eine CSS-Klasse erstellt und das Bild dann im Bildeditor ...

P粉821231319 2023-08-15 19:14:43 0  1  569