`

非常不错的CSS表单显示效果

阅读更多
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>非常不错的Css表单显示效果</title>
<style type="text/css">
body{
font-family: verdana,font-size: 12px;color: #FFFFFF;background-color:#ffffff}
.en1 {
font-size: 10px;font-family: Verdana
}
.input1{
font-family: verdana;background-color: #EEEEEE;border-bottom: #FFFFFF 1px solid;border-left: #CCCCCC 1px solid;border-right: #FFFFFF 1px solid;border-top: #CCCCCC 1px solid;font-size: 12px;
}
.input1-bor {
font-family:verdana;background-color:#F0F8FF;font-size: 12px;
border: 1px solid #333333;}
</style>
<style type="text/css">
<!--
.en1 {font-size: 10px;font-family: Verdana
}
.input1 {font-family: verdana;background-color: #EEEEEE;border-bottom: #FFFFFF 1px solid;border-left: #CCCCCC 1px solid;border-right: #FFFFFF 1px solid;border-top: #CCCCCC 1px solid;font-size: 12px;
}
-->
</style>
</head>
<body>
<table cellspacing=2 cellpadding=0 width=300 border=0>
<tr>
<td><font class="en1">姓名:</font> </td>
<td><input size=40 name=name class="input1" onblur="this.className='input1'" onfocus="this.className='input1-bor'">
</td>
</tr>
<tr>
<td><font class="en1">邮箱:</font></td>
<td><input size=40 name=email class="input1" onblur="this.className='input1'" onfocus="this.className='input1-bor'"></td>
</tr>
<tr>
<td><font class="en1">网址:</font> </td>
<td><input size=40 name=url class="input1" onblur="this.className='input1'" onfocus="this.className='input1-bor'">
</td>
</tr>
<tr>
<td><font class="en1">主题:</font> </td>
<td><input size=40 name=subject class="input1" onblur="this.className='input1'" onfocus="this.className='input1-bor'">
</td>
</tr>
<tr>
<td><font class="en1">内容: </font> </td>
<td><textarea name=message rows=5 cols=35 class="input1" onblur="this.className='input1'" onfocus="this.className='input1-bor'">

 

分享到:
评论
1 楼 yuying 2008-12-16  
谢谢诶!

相关推荐

    CSS表单显示效果示例

    因此,理解并掌握CSS表单显示效果至关重要。 首先,让我们从基本的表单元素开始。HTML提供了多种表单元素,如`&lt;input&gt;`(用于输入文本、密码、电子邮件等)、`&lt;textarea&gt;`(用于多行文本输入)、`&lt;select&gt;`(用于...

    非常不错的表单显示效果.rar

    "非常不错的表单显示效果.rar"这个压缩包显然包含了关于如何创建吸引人且用户友好的表单展示的一些示例或代码资源。从标签"JS特效-表单按钮"我们可以推测,这个项目可能着重于使用JavaScript来增强表单中的按钮效果...

    很不错的CSS表单效果

    在网页设计中,表单是不可或缺的元素,用于...总结起来,CSS3在美化和增强表单效果方面发挥了重要作用,但与JavaScript的有效结合才是实现高级交互的关键。理解并熟练运用这些技术,能让你的网页表单设计更上一层楼。

    CSS样式表单美化系列

    通过有效的CSS技巧,我们可以让表单不仅功能完善,而且视觉效果出众。 首先,我们来看表单的基本结构。一个标准的HTML表单通常由`&lt;form&gt;`标签开启,内含各种输入元素,如`&lt;input&gt;`、`&lt;select&gt;`、`&lt;textarea&gt;`,以及...

    css3用户体验注册表单.zip

    5. **响应式设计**:CSS3的媒体查询功能使表单能够适应不同设备和屏幕尺寸,确保在手机、平板电脑和桌面端都有良好的显示效果。 6. **表单验证**:CSS3可以与HTML5的内置验证特性配合,如`required`属性和`pattern`...

    css表单交互模板.zip

    本项目"css表单交互模板.zip"提供了一种利用纯CSS实现的前端表单交互设计,不仅增强了用户体验,还具有自动记忆功能,极大地提升了表单填写的便捷性。 首先,我们要理解CSS在表单设计中的应用。在HTML中,表单元素...

    很美观及实用的html5+css3表单验证效果

    接下来是CSS3,它带来了丰富的样式和动画效果,使表单验证的反馈更加直观和吸引人。在`styles.css`文件中,可能会定义不同状态(如:正常、聚焦、错误或成功)下的输入框和提示信息的样式。例如,可以设置错误状态下...

    漂亮的css表单样式

    【CSS表单样式】在网页设计中,表单是一个至关重要的元素,用于收集用户信息,如登录、注册、调查等。CSS(层叠样式表)是网页设计中的核心技术,用于控制网页元素的外观和布局。本资源提供了一种用CSS实现的漂亮...

    14种CSS3炫酷表单input输入框美化效果

    CSS3作为CSS的最新版本,提供了一系列强大的新特性,使得表单输入框(input)的美化变得非常容易且多样化。本资源“14种CSS3炫酷表单input输入框美化效果”正是围绕这一主题展开,旨在帮助开发者创造出更具吸引力和...

    html5和css3表单必填字段美化效果

    在本主题“html5和css3表单必填字段美化效果”中,我们将深入探讨如何利用这两者来优化和美化网页表单中的必填字段。 首先,HTML5在表单元素上引入了新的属性,如`required`,用于标识某个字段为必填。当用户尝试...

    html css表单下载

    纯CSS表单设计强调不依赖JavaScript或者其他库,完全通过CSS实现表单的交互和美化。这可能包括响应式设计,使得表单在不同设备上都能良好显示;或者包含一些创新的动画效果,增强用户交互体验。 在实际应用中,你...

    纯CSS实现漂亮的表单

    在网页设计中,表单是不可或缺...总的来说,纯CSS实现漂亮的表单需要对CSS布局、样式设计、响应式以及交互效果有深入的理解。通过不断实践和学习,我们可以创造出既有功能性又具视觉吸引力的表单,提升用户的使用体验。

    CSS3实现分步骤进行的注册表单效果.rar

    "CSS3实现分步骤进行的注册表单效果"是一个很好的示例,它展示了如何利用先进的Web技术提高用户交互性,特别是对于那些涉及多步骤填写的表单。这个项目的核心是通过HTML5和CSS3来构建一个动态的、无需跳转页面的多步...

    html5+css3实现酷炫的form表单

    HTML5和CSS3是现代网页开发的两大核心技术,它们为创建功能强大且视觉效果丰富的form表单提供了无限可能。在本教程中,我们将探讨如何利用这两者的优势来设计和实现酷炫的form表单。 首先,HTML5引入了新的表单元素...

    js css3登录注册表单滑动显示效果.zip

    总结来说,"js css3登录注册表单滑动显示效果.zip"中的实现是通过结合JavaScript和CSS3的力量,创建了一个优雅的用户界面效果。当用户点击登录或注册按钮时,相应的表单会以平滑的滑动动画展示,增强了用户与网页的...

    纯css3网站会员登录注册表单切换效果

    【纯CSS3网站会员登录注册表单切换效果】是一种利用CSS3特性实现的网页交互设计,它可以提升用户体验,使得用户在登录和注册两种不同功能之间流畅地切换,无需跳转页面或显示新的表单。这一效果的核心在于CSS3的选择...

    漂亮的css表单样式3

    【漂亮的css表单样式3】是一个关于前端设计的资源,主要关注的是如何使用CSS来美化网页中的表单元素,特别是登录和注册页面。这个资源包含了多个CSS样式文件,旨在为开发者提供美观且易于理解的表单设计示例,使得...

    CSS3动态背景登录表单特效代码 带登录成功欢迎切换提示特效.zip

    在创建动态背景登录表单时,我们可以利用CSS3的`animation`属性和`background-image`属性,来制作平滑的背景动画效果。例如,可以设置多个背景图片,通过改变背景图片的位置或透明度,创建出流动或淡入淡出的效果。 ...

    HTML5+CSS3超酷动态表单

    HTML5和CSS3是现代网页开发的两大核心技术,它们为创建功能丰富、视觉效果吸引人的动态表单提供了无限可能。本教程将深入探讨如何利用HTML5的新特性与CSS3的高级样式来构建一个"超酷动态表单",在用户输入时能够实现...

    CSS3弹出Metro登录表单.zip

    可以使用`addEventListener`来监听用户的点击事件,然后通过修改CSS属性(如`style.display`)来控制表单的显示和隐藏。为了增强用户体验,还可以添加表单验证功能,比如使用`addEventListener`监听`submit`事件,并...

Global site tag (gtag.js) - Google Analytics