Schriftreferenzen und Übergangseffekte außerhalb des Systems

Code kopieren

Der Code lautet wie folgt:

<span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-size:14px;">1. Externe Schriftartreferenz: Verwenden Sie font-face, um Schriftarten einzuführen</span></span>

Manchmal müssen wir Schriftarten verwenden, die nicht im System vorhanden sind. Möglicherweise müssen wir auf die Schriftarten verweisen, die wir von außen heruntergeladen haben. Die Methode ist:

Code kopieren

Der Code lautet wie folgt:

<!DOCTYPE html>
<html>
<Kopf>
<title>Schriftartenreferenz</title>
<meta charset="utf-8">
<style type="text/css">
<span style="white-space:pre"> </span>/*Verwenden Sie @font-face, um Schriftarten einzuführen*/
@Schriftart{
Schriftfamilie: heeh;
/*Die folgenden drei Formen sind alle möglich*/
/*src:url("Sansation_Light.ttf");*/
/*src:url('URL-Adresse des Servers.ttf');*/
src:url(Fangzheng Fat Baby vereinfacht.ttf);
}
.tb{
Schriftgröße: 80px;
Farbe: #f40;
Schriftstärke: 300;
<span style="white-space:pre"> </span><span style="white-space:pre"> </span>/*Geben Sie hier den Namen der referenzierten Schriftart an*/
Schriftfamilie: heeh;
}
</Stil>
</Kopf>
<Text>
<h1 Klasse="tb">Taobao</h1>
</body>
</html>

2. Übergangseffekt: Attribut ist Übergang

Wenn die Maus in einen bestimmten Bereich bewegt wird, tritt ein Übergangseffekt auf, bevor der Effekt erzielt wird. wie

Code kopieren

Der Code lautet wie folgt:

<!DOCTYPE html>
<html>
<Kopf>
<title>Übergang</title>
<meta charset="utf-8">
<style type="text/css">
.div_tran{
Breite: 130px;
Höhe: 100px;
/*a in rgba ist Transparenz (Bereich 0~1)*/
Hintergrund: rgba(165,237,15,0,5);
/*Hintergrund: rgb(165,237,15);*/
/*CSS-Transparenzeigenschaft Opazität (Bereich 0~1)*/
Deckkraft: .3;
Farbe: #000;
<span style="white-space:pre"> </span>/*Dieser Kommentar und der folgende Satz sind beide akzeptabel*/
/*-webkit-transition:Breite 2s,Höhe 3s,Hintergrund,Deckkraft 2,5s; */
-webkit-transition:alle 3s;
}
.div_tran:hover{
Breite: 200px;
Höhe: 200px;
Hintergrund: rgb(28,227,209);
Deckkraft: 1;
Farbe: rot;
}
/* Spanne{
Deckkraft: 1;
Position: relativ;
oben: -100px;
}*/
</Stil>
</Kopf>
<Text>
<div Klasse="div_tran">
Übergang
</div>

</body>
</html>

<<: Detaillierte Erklärung des Marquee-Attributs in HTML

>>: Detaillierte Erklärung des JavaScript-Proxy-Objekts

Zusammenfassung einiger Grundsätze, die bei der Ausgabe von HTML-Seiten beachtet werden sollten

Schriftreferenzen und Übergangseffekte außerhalb des Systems

Zusammenfassung einiger Grundsätze, die bei der Ausgabe von HTML-Seiten beachtet werden sollten

Einführung in ApplicationHost.config (IIS-Speicherkonfigurationsbereichsdatei)

JavaScript-Grundlagen: Funktion zur sofortigen Ausführung

Ausführliche Erläuterung der MySQL-Isolationsebene und des Sperrmechanismus

Beispielcode zur Implementierung eines einfachen ListViews-Effekts in HTML

Sprechen Sie kurz über MySQL Left Join Inner Join

Vue.js implementiert Musikplayer

Analyse der Prinzipien der MySQL Slow Query-bezogenen Parameter

Grundlegendes Verständnis und Verwendung der HTML-Auswahloption

Grafisches Tutorial zur MySQL 5.7-Konfiguration ohne Installation

Artikel empfehlen

Einige Parameterbeschreibungen von Texteingabefeldern im Webdesign

Was ist COLLATE in MYSQL?

Methodenbeispiel zum sicheren Abrufen tiefer Objekte von Object in Js

Lösen Sie die Probleme, die bei der Installation von MySQL 8.0 auf einem Win10-System auftreten

Beispiel für die Verwendung von CSS3 zum Anpassen des Stils eines Eingabe-Mehrfachauswahlfelds

Div kann Inhalte eingeben, ohne die Eingabe als Eingabefeld zu verwenden, um den automatischen Eingabestil zu blockieren

Einführungstutorial zu React Hooks

Beispiel für die Konvertierung eines eindimensionalen JS-Arrays in ein dreidimensionales Array

Zwei Verwendungen von iFrame-Tags in HTML

Einführung in den glibc-Upgradeprozess für Centos6.5

Vue implementiert den Schnittstellen-Gleiteffekt

vue + springboot realisiert die Login-Funktion

Saubere XHTML-Syntax

Implementierung der Docker-Bereitstellung des SQL Server 2019 Always On-Clusters

Eine kurze Analyse des Unterschieds zwischen und und wo in der MySQL-Verbindungsabfrage