html表单边框怎么加颜色?html form标签的边框颜色实例

本篇文章主要的讲述了HTML表单的边框加颜色,可以更改任何你想要的颜色都可以,有实例解析,方便观看,接下来让我们一起来看看这篇关于HTML表单的边框颜色的文章吧

打造全网web前端全栈资料库(总目录)看完学的更快,掌握的更加牢固,你值得拥有(持续更新)

首先我们说的是表单的边框怎么添加颜色?

<input>标签用于搜集用户信息。根据不同的type属性值,输入字段拥有很多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。

提示:在 HTML 中,<input> 标签没有结束标签;在 XHTML 中,<input> 标签必须被正确地关闭。

提示:请使用 label 元素为某个表单控件定义标签。

先来看一个HTML表单边框的使用实例:

<form action="form_action.asp" method="get">

请输用户名: <input type="text" name="fname" /></br>

重复用户名: <input type="text" name="lname" /></br>

<input type="submit" value="提交" />

</form>

  

这个在浏览器中显示的效果为:


 

这个效果相信我们在很多时候都见过,也用过不少次。

这是还没加入边框的,现在说说怎么加边框:

我们这篇文章用的是css样式来设置边框线,比如添加这样样式:

<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>

重复用户名: <input type="text" name="lname" /></br>

<input type="submit" value="提交" />

</form>

</html>

  

现在来看看效果,有没有3像素的边框:


 

如图,添加了三个像素的红色边框把表单都包裹起来了,这个代码是不是也很简单,这个我们就要可以用来调整边框线的颜色啊,和像素调整都可以。

这篇关于HTML表单的边框的文章到这也就结束了,更多问题可以关注我!!!

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章