Verwenden Sie Iframe, um Wettereffekte auf Webseiten anzuzeigen

Verwenden Sie Iframe, um Wettereffekte auf Webseiten anzuzeigen
CSS:

Code kopieren
Der Code lautet wie folgt:

*{Rand:0;Padding:0;Listenstiltyp:keine;}
ein,img{border:0;}
body{font:12px/180% Arial, Helvetica, sans-serif, "Schriftart";}
/* Demo */
.demo{width:800px;margin:0 auto;}
.demo div{margin:40px 0 0 0;}

html:

Code kopieren
Der Code lautet wie folgt:

<div Klasse="Demo">
<div>
<iframe name="weather_inc" src="http://i.tianqi.com/index.php?c=code&id=2&num=5" width="650" height="70" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>
</div>
<div>
<iframe name="weather_inc" src="http://i.tianqi.com/index.php?c=code&id=7" style="border:solid 1px red" width="225" height="90" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>
</div>
<div>
<iframe name="weather_inc" src="http://i.tianqi.com/index.php?c=code&id=9" width="800" height="60" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>
</div>
<div>
<iframe name="weather_inc" src="http://i.tianqi.com/index.php?c=code&id=11" width="500" height="15" frameborder="0"></iframe>
</div>
<div>
<iframe name="weather_inc" src="http://i.tianqi.com/index.php?c=code&id=13" width="650" height="221" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>
</div>
<div>
<iframe name="weather_inc" src="http://i.tianqi.com/index.php?c=code&id=19" width="800" height="120" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>
</div>
</div>

Einige Effekte:

Ich habe in meinem Projekt den folgenden Effekt erzielt

<<:  Detailliertes Verständnis der Vue-Methode zum Generieren von QR-Codes mit vue-qr

>>:  Protokoll des Kompilierungs- und Installationsprozesses des Nginx-Quellcodes

Artikel empfehlen

Der Unterschied zwischen useEffect und useLayoutEffect in React

Inhaltsverzeichnis Voraussetzungen Effekt verwend...

Installationsprozess von CentOS8 Linux 8.0.1905 (Abbildung)

Die aktuellste Version von CentOS ist CentOS 8. A...

So finden Sie Informationen zu nicht festgeschriebenen Transaktionen in MySQL

Vor einiger Zeit habe ich einen Blogbeitrag mit d...

Grafisches Tutorial zur Installation und Konfiguration von MySQL 8.0.22 winx64

Das Tutorial zur Datenbankinstallation von MySQL-...

Eine kurze Diskussion über reguläre JS-RegExp-Objekte

Inhaltsverzeichnis 1. RegExp-Objekt 2. Grammatik ...

MySQL MSI Installations-Tutorial unter Windows 10 mit Bildern und Text

1. Herunterladen 1. Klicken Sie auf den neuesten ...

MySQL sollte niemals Update-Anweisungen wie diese schreiben

Inhaltsverzeichnis Vorwort Ursache Phänomen warum...

Einfache Schritte zum Konfigurieren des Nginx-Reverse-Proxys mit SSL

Vorwort Ein Reverse-Proxy ist ein Server, der übe...

Nginx-Signalsteuerung

Einführung in Nginx Nginx ist ein leistungsstarke...

MySQL 8.0.12 – Schnellinstallations-Tutorial

Die Installation von MySQL 8.0.12 dauerte zwei Ta...

Kernkompetenzen, die Web-Frontend-Entwicklungsingenieure beherrschen müssen

Der Inhalt der Web-Frontend-Entwicklung umfasst h...