Heim > Artikel > Web-Frontend > So entfernen Sie den Rahmen von der CSS-Schaltfläche
In CSS können Sie das Attribut „border“ verwenden, um den Rahmen von der Schaltfläche zu entfernen. Sie müssen nur den Stil „border: none;“ für das Schaltflächenelement festlegen. Das border-Attribut wird verwendet, um den Rahmenstil für das Element festzulegen. Wenn der Wert von border „none“ ist, bedeutet dies, dass der Rahmen entfernt und ein randloser Stil definiert wird.
Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.
Erstellen Sie eine neue HTML-Datei mit dem Namen test.html, um zu erklären, wie Sie den Rahmen einer Schaltfläche (Schaltfläche) in CSS entfernen.
Verwenden Sie in der Datei test.html das Button-Tag, um eine Schaltfläche zum Testen zu erstellen.
<button>按钮</button>
Fügen Sie in der Datei test.html ein ID-Attribut zur Schaltfläche button hinzu, um den Stil festzulegen.
<button id="button">按钮</button>
Schreiben Sie in die Datei test.html das Tag und der CSS-Stil der Seite wird in dieses Tag geschrieben.
Legen Sie im CSS-Tag den Stil der Schaltfläche über ihre ID fest, definieren Sie ihre Hintergrundfarbe als Blau und ihre Textfarbe als Weiß. Setzen Sie schließlich das Rahmenattribut auf „Keine“, um den Rahmen der Schaltfläche zu entfernen.
#button{ background: blue; color: #fff; border: none; }
Öffnen Sie die Datei test.html im Browser, um den Effekt zu sehen.
Empfohlenes Lernen: CSS-Video-Tutorial
Das obige ist der detaillierte Inhalt vonSo entfernen Sie den Rahmen von der CSS-Schaltfläche. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!