jQuery Corner ist ein jQuery-Plug-in, das ursprünglich von Dave Methvin entwickelt wurde, aber mit der Unterstützung von Genosse Malsup wurden einige wichtige Verbesserungen vorgenommen. Das Projekt befindet sich jetzt auf Github. Der Einfachheit halber wird in diesem Artikel das Plug-in natürlich als Anhang bereitgestellt. Wenn Sie jedoch die neueste Version erhalten möchten, gehen Sie bitte zum Github des Projekts.
Der Grund, warum abgerundete Ecken und andere Stile wie von Zauberhand erscheinen, liegt darin, dass das Plug-in dem Zielelement einige kleine Streifen hinzufügt. Diese kleinen Streifen stellen die Hintergrundfarbe dar, sodass das menschliche Auge nur abgerundete Ecken sieht, die jedoch tatsächlich klein sind verdeckt den ursprünglichen rechten Winkel.
Es scheint, dass ich wirklich kein Zauberer bin. Ich habe meinen Hintergrund gleich zu Beginn offengelegt. Keine Sorge, ich möchte einige Anforderungen für diese Magie hinzufügen:
1. Das Plug-in ist speziell für Blockelemente geschrieben, daher sind div, p usw. nicht so erfolgreich. Dies bedeutet natürlich nicht, dass Inline überhaupt nicht verwendet werden kann Es ist teurer, Ecken zur Spannweite hinzuzufügen. Normale Leute würden jedoch nicht mit den abgerundeten Ecken von span streiten, also ändern Sie einfach span in div.
2. Was die durch das Plug-in neu hinzugefügte Border-Radius-Funktion betrifft, so unterstützt IE<=8 sie nicht, aber alle Browser außer IE unterstützen sie. Verdammt, lasst uns die aktuelle Situation der IE6-Überschwemmungen in unserem Land zutiefst verachten.
OK, die grundlegenden Punkte wurden eingeführt. Bringen Sie jedem bei, wie man es benutzt. Das ist der entscheidende Punkt, aber es ist sehr einfach. Der erste Schritt besteht darin, eine einfache HTML-Webseite, ein DIV-Layout und CSS zu erstellen.
<html> <head> <style type="text/css"> div{ width:350px; height:200px; background-color: #6af; } </style> </head> <body> <div></div> </body>