CSS伪类

最新推荐文章于 2025-09-12 13:16:34 发布

转载最新推荐文章于 2025-09-12 13:16:34 发布 · 66 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/boyblog/p/4575366.html

文章标签：

#php

一、伪类focus的作用

1、用于给表单方框里添加点击特效 [IE不支持]

<html>
 <head>
  <title>表单</title>
  <style type="text/css">
  input:focus{ border:#0FF; solid:; background-color:#F00;}
  </style>
 </head>
 <body>
<form caption="注册.php" name="reg" method="post">
<table border="0" cellpadding="5" align="center" width="100">
<tr>
<td>用户名</td>
<td><input type="text" name="uername"</td>
</tr>
<tr>
<td>密   码</td>
<td><input type="password" name="mima"></td>
</tr> 
<tr>
<td align="center" colspan="1"><input type="submit" value="注册"></td>
<td align="center" colspan="50"><input type="submit" value="登录"></td>
</tr>
</form>
 </body>
</html>

二、伪类的语法

　　input：focus{background:blue;}

三、超链接伪类

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
a:link {color: #FF0000}		/* 未访问的链接 */
a:visited {color: #00FF00}	/* 已访问的链接 */
a:hover {color: #FF00FF}	/* 鼠标移动到链接上 */
a:active {color: #0000FF}	/* 选定的链接 */
</style>

</head>

<body>
<p><a href="http://www.baodi.com">这是一个链接</a></p>
</body>
</html>

转载于:https://www.cnblogs.com/boyblog/p/4575366.html