<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>NiceJForms by Lucian Lature</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/nicejforms.js"></script>
<style type="text/css" media="screen">@import url(css/niceforms-red.css);</style>
</head>
<body>
<div id="container">
<h1 style="margin-bottom:30px; color:#900;">NiceJForms</h1>
<form action="vars.php" method="POST" class="niceform">
<select size="1" id="mySelect1" name="mySelect1" class="width_320">
<option selected="selected" value="Test area no.1">Test area no.1</option>
<option value="Another test option">Another test option</option>
<option value="And another one">And another one</option>
<option value="One last option for me">One last option for me</option>
<option value="This is one really really long option right here just to test it out">This is one really really long option right here just to test it out</option>
</select>
<br />
<select size="1" id="mySelect2" name="mySelect2" class="width_160">
<option value="Test area no.2">Test area no.2</option>
<option value="Another test">Another test</option>
<option selected="selected" value="And another one">And another one</option>
<option value="And yet another one">And yet another one</option>
<option value="One last option for me">One last option for me</option>
</select>
<br />
<input type="radio" name="radioSet" id="option1" value="foo" checked="checked" /><label for="option1">foo</label><br />
<input type="radio" name="radioSet" id="option2" value="bar" /><label for="option2">bar</label><br />
<input type="radio" name="radioSet" id="option3" value="another option" /><label for="option3">another option</label><br />
<br />
<input type="checkbox" name="checkSet1" id="check1" value="foo" /><label for="check1">foo</label><br />
<input type="checkbox" name="checkSet2" id="check2" value="bar" checked="checked" /><label for="check2">bar</label><br />
<input type="checkbox" name="checkSet3" id="check3" value="another option" /><label for="check3">another option</label><br />
<br />
<label for="textinput">Username:</label><br />
<input type="text" id="textinput" name="textinput" size="12" /><br />
<label for="passwordinput">Password:</label><br />
<input type="password" id="passwordinput" name="passwordinput" size="20" /><br />
<br />
<label for="textareainput">Comments:</label><br />
<textarea id="textareainput" name="textareainput" rows="10" cols="30"></textarea><br />
<br />
<input type="submit" value="Submit this form" />
</form>
<h2 style="margin-top:30px;">NiceJForms v0.1</h2>
<p>© Lucian Lature - <a href="emailto:lucian.lature@gmail.com">email to me</a></p>
<p>Feel free to use and modify but please provide credits.</p>
</div>
<script type="text/javascript">
$(document).ready(function(){
$.NiceJForms.build({
imagesPath:"css/images/redtheme/"
})
});
</script>
</body>
</html>
漂亮的表单NiceJForms v0.1（3种样式）
5星 · 超过95%的资源 需积分: 0 158 浏览量
更新于2008-04-15
1
收藏 92KB RAR 举报 《NiceJForms v0.1：打造美观网页表单的艺术》
在网页设计领域，表单元素往往是用户体验的重要组成部分，而“漂亮的表单NiceJForms v0.1（3种样式）”则为设计师和开发者提供了一套优雅的解决方案。这款资源包含三种不同风格的表单样式，旨在提升网站的交互性和视觉吸引力。
NiceJForms v0.1的核心亮点在于其独特的设计美学和实用性。它提供了红色、绿色和默认风格的表单，每种样式都具有鲜明的个性，能够适应不同的网站主题和品牌色彩。这些表单不仅色彩搭配和谐，而且在布局和元素设计上也充分考虑了用户的操作习惯，使填写过程变得更为流畅。
在技术实现上，NiceJForms v0.1依赖于HTML、CSS和JavaScript的高效组合。其中，readme.htm文件是用户指南，包含了关于如何使用和定制表单的详细说明，对于开发者来说是不可或缺的参考文档。其余的html文件（nicejforms_red.html、nicejforms_green.html、nicejforms.html）分别展示了三种不同样式的表单，可以直接在网页中嵌入或作为灵感来源。而"css"和"js"文件夹则包含了支撑这些表单样式的CSS样式表和JavaScript代码，这些代码经过精心优化，确保了表单在各种设备和浏览器上的良好兼容性。
在CSS方面，NiceJForms v0.1利用了选择器和类来定义表单元素的样式，包括字体、颜色、边框、背景以及间距等，使得每个元素都能与整体设计无缝融合。同时，响应式设计的运用确保了表单在不同屏幕尺寸下的适应性，无论是桌面端还是移动端用户都能获得一致的体验。
JavaScript部分则是实现动态效果和交互的关键。例如，表单验证功能可以通过JS来实现，当用户输入不符合要求时，表单会即时给出反馈，提高了用户输入的准确性和效率。此外，通过JS还可以实现按钮的激活、禁用状态切换，以及表单提交后的动画效果，提升了用户体验。
"漂亮的表单NiceJForms v0.1（3种样式）"是一套全面且实用的网页表单解决方案，无论你是设计师寻找灵感，还是开发者寻求高效的表单构建工具，都能从中获益。通过深入理解和应用这套资源，可以让你的网页表单不再单调，而是成为提升网站品质的亮点。
漂亮的表单NiceJForms v0.1（3种样式）.rar （98个子文件） 
css 
niceforms-default.css 4KB niceforms-green.css 4KB images 
title.jpg 10KB greentheme 
button_left.gif 330B txtarea_l.gif 92B button_right_xon.gif 332B select_left.gif 535B txtarea_tl.gif 144B button_left_xon.gif 328B checkbox.gif 689B txtarea_tl_xon.gif 144B txtarea_cntr_xon.gif 228B txtarea_tr.gif 491B txtarea_bl.gif 142B select_right.gif 673B input_bg.gif 210B txtarea_l_xon.gif 92B button_right.gif 336B input_left_xon.gif 559B txtarea_tr_xon.gif 498B input_left.gif 340B Thumbs.db 32KB txtarea_br.gif 376B input_right.gif 331B txtarea_bl_xon.gif 142B input_right_xon.gif 345B button_bg.gif 158B select_bg.gif 88B radio.gif 745B txtarea_cntr.gif 373B txtarea_br_xon.gif 382B default blank.gif 43B button_left.gif 338B txtarea_l.gif 100B button_right_xon.gif 340B select_left.gif 543B txtarea_tl.gif 152B button_left_xon.gif 336B checkbox.gif 689B txtarea_tl_xon.gif 152B txtarea_cntr_xon.gif 236B txtarea_tr.gif 499B txtarea_bl.gif 150B select_right.gif 681B input_bg.gif 218B txtarea_l_xon.gif 100B button_right.gif 344B input_left_xon.gif 567B txtarea_tr_xon.gif 506B input_left.gif 348B Thumbs.db 34KB txtarea_br.gif 384B input_right.gif 339B txtarea_bl_xon.gif 150B input_right_xon.gif 353B button_bg.gif 166B select_bg.gif 96B radio.gif 745B txtarea_cntr.gif 381B txtarea_br_xon.gif 390B Thumbs.db 5KB redtheme button_left.gif 330B txtarea_l.gif 92B button_right_xon.gif 332B select_left.gif 535B txtarea_tl.gif 144B button_left_xon.gif 328B checkbox.gif 689B txtarea_tl_xon.gif 144B txtarea_cntr_xon.gif 228B txtarea_tr.gif 491B txtarea_bl.gif 142B select_right.gif 673B input_bg.gif 210B txtarea_l_xon.gif 92B button_right.gif 336B input_left_xon.gif 559B txtarea_tr_xon.gif 498B input_left.gif 340B Thumbs.db 6KB txtarea_br.gif 376B input_right.gif 331B txtarea_bl_xon.gif 142B input_right_xon.gif 345B button_bg.gif 158B select_bg.gif 88B radio.gif 745B txtarea_cntr.gif 373B txtarea_br_xon.gif 382B bg.jpg 755B niceforms-red.css 4KB readme.htm 5KB
nicejforms_red.html 3KB nicejforms.html 3KB nicejforms_green.html 3KB js nicejforms-interface.js 20KB nicejforms.js 21KB jquery.js 20KB2020-10-31 上传
130 浏览量
5星 · 资源好评率100% 5星 · 资源好评率100%115 浏览量
5星 · 资源好评率100% 5星 · 资源好评率100%143 浏览量
164 浏览量
5星 · 资源好评率100%169 浏览量
5星 · 资源好评率100%154 浏览量
2019-11-26 上传
159 浏览量
2021-02-22 上传
2022-02-12 上传
197 浏览量
191 浏览量
资源评论
graper2013-12-01不错，很漂亮，很实用
fengchunlei9992013-10-24不错很漂亮很实用
zhangjie617
- 粉丝: 8
- 资源: 9
最新资源
- Windows检查电池健康度的批处理脚本实现
- 用HTML5和JavaScript实现动态过年鞭炮场景
- 快速排序在Go中的高效实现与应用
- 对象检测23-YOLO（v5至v11）、COCO、CreateML、Paligemma、TFRecord、VOC数据集合集.rar
- 云原生-k8s知识学习-CKA考前培训
- Python实现HTML压缩功能
- 完结26章Java主流分布式解决方案多场景设计与实战
- ECSHOP模板堂最新2017仿E宠物模板 整合ECTouch微分销商城
- Pear Admin 是 一 款 开 箱 即 用 的 前 端 开 发 模 板，提供便捷快速的开发方式，延续 Admin 的设计规范
- 51单片机仿真摇号抽奖机源程序12864液晶显示仿真+程序
