网站首页 工具软件 操作系统 办公软件 网页制作 PHP教程 script脚本专栏 photoshop教程 其他精品教程
我发布的文章 - 教程搜索 - 交流论坛 - 帮助中心 - 网站首页 网络工具 - 常用工具 - 媒体工具 - 系统工具 - 实用工具 NT/2003 - Win Xp - Win2000 - DOS/Win9x - IE/注册表 - Linux - 苹 果 Office - Word - Excel - PowerPoint - 输入法 - 邮件处理 Flash - Dreamweaver - Fireworks - FrontPage - HTMLCSS 基础文章 - PHP函数 - PHP技巧 - 数据库相关 - 高级应用 - PHP安装 - 转载精华 - 常见问题 综 合 类 - 状 态 栏 - 游 戏 类 - 页面背景 - 页面特效 - 页面导航 - 文本操作 - 文本特效 - 图形特效 - 鼠标特效 - 时间日期 - 密 码 类 文字特效 - 按钮与图标 - 色彩运用 - 滤镜魔法 - 综合实例 XML教程 - DELPHI基础教程 - VB教程
首页 -> 网页制作 -> HTMLCSS

TOP

用CSS轻松实现网上填空
文章内容
相关信息
用户评论
文章内容

在网上做有奖信息的时候,经常看见一些注册表单,只有一条线供你填写,就跟做考卷时的填空题一样,很Cool!

其实要做成这样的效果并不难,只需用一段很简短的CSS代码即可搞定!

    < style type="text/css">
  < !--
  .xian{BORDER-LEFT-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-TOP-STYLE: none}
  -- >
  < /style>

    其中代码的作用如下:

    “BORDER-LEFT-STYLE:none”: 不显示左边框
  “BORDER-RIGHT-STYLE: none”: 不显示右边框
  “BORDER-TOP-STYLE: none”: 不显示上边框
  “BORDER-bottom-STYLE: none”: 不显示上边框,加上这条,什么边框也没有了

    让我们一起来看一个应用实例吧:

    < html>
  < head>
  < title>网上填空< /title>
  < style type="text/css">
  < !--
  .xian{BORDER-LEFT-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-TOP-STYLE: none ;}
  -- >
  < /style>< !--注:此段为css代码,在这里更改参数可以设置出更cool的效果-->
  < /head>
  < body bgcolor="#FFFFFF" text="#000000">
  隐藏你的边框
  < p>用户名:
  < input type="text" name="name" class=xian> < !--注:class=这条一定要加,设置你的css应用在表单里面-- >
  < /p>
  < /body>
  < /html>

    实现的效果简洁清爽,怎么样,也改改你的表单吧!


相关信息
用CSS轻松实现网上填空
发布者:lfj
浏览量:172
发布日期:2005-03-08 13:37:42
所属专题:
用户评论
称  呼:
内  容:

广告位

广告招租,欢迎抢订

热门信息

·从HTML语言到网上家园 第一..
·从HTML语言到网上家园 第二..
·从HTML语言到网上家园 序章
·从HTML语言到网上家园 第三..
·从HTML语言到网上家园 第五章
·HTML:让网页超链接拥有多..
·个人网站制作全接触(中)
·个人网站制作全接触(下)

推荐信息