明輝手游網(wǎng)中心：是一個免費提供流行視頻軟件教程、在線學(xué)習(xí)分享的學(xué)習(xí)平臺！

html表單邊框如何加顏色？html form標(biāo)簽的邊框顏色案例

發(fā)表時間：2023-09-02 來源：明輝站整理相關(guān)軟件相關(guān)文章人氣：

[摘要]本篇文章主要的講述了HTML表單的邊框加顏色，可以更改任何你想要的顏色都可以，有實例解析，方便觀看，接下來讓我們一起來看看這篇關(guān)于HTML表單的邊框顏色的文章吧首先我們說的是表單的邊框怎么添加顏色？<input>標(biāo)簽用于搜集用戶信息。根據(jù)不同的type屬性值，輸入字段擁有很多種形式。輸...
本篇文章主要的講述了HTML表單的邊框加顏色，可以更改任何你想要的顏色都可以，有實例解析，方便觀看，接下來讓我們一起來看看這篇關(guān)于HTML表單的邊框顏色的文章吧

首先我們說的是表單的邊框怎么添加顏色？

<input>標(biāo)簽用于搜集用戶信息。根據(jù)不同的type屬性值，輸入字段擁有很多種形式。輸入字段可以是文本字段、復(fù)選框、掩碼后的文本控件、單選按鈕、按鈕等等。

提示：在 HTML 中，<input> 標(biāo)簽沒有結(jié)束標(biāo)簽；在 XHTML 中，<input> 標(biāo)簽必須被正確地關(guān)閉。

提示：請使用 label 元素為某個表單控件定義標(biāo)簽。

先來看一個HTML表單邊框的使用實例：

<form action="form_action.asp" method="get">
  請輸用戶名: <input type="text" name="fname" /></br>
  重復(fù)用戶名: <input type="text" name="lname" /></br>
  <input type="submit" value="提交" />
</form>

這個在瀏覽器中顯示的效果為：

tuyi.png

這個效果相信我們在很多時候都見過，也用過不少次。

這是還沒加入邊框的，現(xiàn)在說說怎么加邊框：

我們這篇文章用的是css樣式來設(shè)置邊框線，比如添加這樣樣式：

<style>
form{
    border: 3px solid red;
}
</style>

里面的效果就出來，我們一起把全部的代碼都敲出來吧：

<html>
<head>
<style>
form{
    border: 3px solid red;
}
</style>
</head>
<form action="form_action.asp" method="get">
  請輸用戶名: <input type="text" name="fname" /></br>
  重復(fù)用戶名: <input type="text" name="lname" /></br>
  <input type="submit" value="提交" />
</form>
</html>

現(xiàn)在來看看效果，有沒有3像素的邊框：

tuer.png

如圖，添加了三個像素的紅色邊框把表單都包裹起來了，這個代碼是不是也很簡單，這個我們就要可以用來調(diào)整邊框線的顏色啊，和像素調(diào)整都可以。

這篇關(guān)于HTML表單的邊框的文章到這也就結(jié)束了（想學(xué)更多的編程知識，歡迎來PHP中文網(wǎng)學(xué)習(xí)），有問題的可以在下方提問。

【小編推薦】

html中的ol標(biāo)簽如何去掉標(biāo)號呢？<ol>標(biāo)簽的使用方法總結(jié)

HTML中ul標(biāo)簽如何去掉點？HTML無序列表的樣式實例解析

以上就是html表單邊框怎么加顏色？html form標(biāo)簽的邊框顏色實例的詳細內(nèi)容，更多請關(guān)注php中文網(wǎng)其它相關(guān)文章！


網(wǎng)站建設(shè)是一個廣義的術(shù)語，涵蓋了許多不同的技能和學(xué)科中所使用的生產(chǎn)和維護的網(wǎng)站。