Wenn ich Preisinformationen online mache, sehe ich oft Anmeldeformulare mit nur einer Zeile zum Ausfüllen, genau wie die Lückentextfragen in Prüfungsbögen, was sehr cool ist!
Tatsächlich ist es nicht schwer, einen solchen Effekt zu erzielen. Sie müssen nur einen sehr kurzen CSS-Code verwenden, um ihn zu erzielen!
| Nachfolgend der zitierte Inhalt: < style type="text/css"> < !-- .xian{BORDER-LEFT-STYLE: keine; BORDER-RIGHT-STYLE: keine; -> </style> |
Die Funktion des Codes ist wie folgt:
| Nachfolgend der zitierte Inhalt: „BORDER-LEFT-STYLE: none“: Den linken Rand nicht anzeigen „BORDER-RIGHT-STYLE: none“: Den rechten Rand nicht anzeigen „BORDER-TOP-STYLE: none“: Den oberen Rand nicht anzeigen „BORDER -bottom-STYLE: none" ": Zeigt den oberen Rand nicht an. Wenn Sie dies hinzufügen, gibt es überhaupt keinen Rand. |
Schauen wir uns ein Anwendungsbeispiel an:
| Nachfolgend der zitierte Inhalt: <html> <Kopf> <title>Füllen Sie die Lücken online aus</title> < style type="text/css"> < !-- .xian{BORDER-LEFT-STYLE: keine; BORDER-RIGHT-STYLE: keine;} -> </ /style>< !--Hinweis: Bei diesem Abschnitt handelt es sich um CSS-Code. Das Ändern der Parameter hier kann einen cooleren Effekt erzielen--> </head> < body bgcolor="#FFFFFF" text="#000000"> Verstecke deine Grenzen <p>Benutzername: < input type="text" name="name" class=xian> <!--Hinweis: class= muss hinzugefügt werden, legen Sie Ihr CSS fest, das im Formular angewendet werden soll--> < /p> < /body> < /html> |
Der erzielte Effekt ist einfach und erfrischend. Wie wäre es, wenn Sie auch Ihre Form ändern würden?