html表单边框怎么加颜色？html form标签的边框颜色实例-html教程-PHP中文网

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

寻∝梦

发布： 2018-08-31 14:45:27

原创

24891人浏览过

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

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

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

提示：在 HTML 中，标签没有结束标签；在 XHTML 中，标签必须被正确地关闭。

提示：请使用 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>

登录后复制

里面的效果就出来，我们一起把全部的代码都敲出来吧：



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

<form action="form_action.asp" method="get">
  请输用户名: <input type="text" name="fname" /></br>
  重复用户名: <input type="text" name="lname" /></br>
  <input type="submit" value="提交" />
</form>

登录后复制

现在来看看效果，有没有3像素的边框：