晋江文学城
下一章 上一章  目录  设置

8、§按钮篇§ ...

  •   某李同学问道:按钮链接怎么做呢?比如效果是这样:
      代码为:<INPUT TYPE=button VALUE=明晓溪官网 OnClick=window.open("http://www.mingxiaoxi.com/?fromuid=3386")>
      
      通用代码:<INPUT TYPE=button VALUE=文字说明 OnClick=window.open("链接网址")>
      

      若要改变背景颜色,代码为<INPUT TYPE=button style="background-color:pink" VALUE=文字说明 OnClick=window.open("链接网址")>
      效果:

      边框颜色也可以更改,代码为:<INPUT type="button" style="border:颜色代码" value="文字" OnClick=window.open("链接")>
      效果:
    红色绿色橙色粉色紫色


      另外,也可以用第四章的链接代码做出按钮效果,代码为:<a href=链接地址 target=blank><font style="border-style: double;" color="颜色代码">文字</font></a>
      双边框效果:明晓溪官网 明晓溪官网 明晓溪官网 明晓溪官网 明晓溪官网

      新增边框特效按钮

      虚线效果:
      虚点效果:
      实线效果:
      突出效果:
      代码分别为:
      虚线:<INPUT type="button" style="cursor:hand; border:3PX #边框颜色代码 dashed; background-color:#背景颜色代码" value="文字" OnClick=window.open("链接")>
      虚点:<INPUT type="button" style="cursor:hand; border:3PX #边框颜色代码 dotted; background-color:#背景颜色代码" value="文字" OnClick=window.open("链接")>
      实线:<INPUT type="button" style="cursor:hand; border:3PX #边框颜色代码 solid; background-color:#背景颜色代码" value="文字" OnClick=window.open("链接")>
      突出:<INPUT type="button" style="cursor:hand; border:3PX #边框颜色代码 outset; background-color:#背景颜色代码" value="文字" OnClick=window.open("链接")>
      

      图片按钮:
      示例:<INPUT TYPE=IMAGE SRC=图片地址 OnClick=window.open("链接网址")>

      代码:<INPUT TYPE=IMAGE SRC=http://www.dingdingxw.com/Images/PostMood/em15.gif OnClick=window.open("http://118739.jjwxc.net")>

      效果:←点点效果看看?

      最基本的类型就是去掉OnClick的语句:<INPUT TYPE=button VALUE=文字说明>
      示例:16章 23章
      
    再来看看单选/复选框吧^_^ 动态网页常常见到的~

      单选代码: <INPUT TYPE=CHECKBOX> 效果:
      选中代码:<INPUT TYPE=CHECKBOX checked> 效果:

      复选代码: <INPUT TYPE=radio> 效果:
      选中代码:<INPUT TYPE=radio checked>效果:

      方框代码: <INPUT TYPE=BOX>效果:
      有字代码:<INPUT TYPE=BOX value=箱子>效果:

      口令代码:<INPUT TYPE=PASSWORD>效果:
      口令赋值:<INPUT TYPE=PASSWORD VALUE=123>效果:
      (普及一点信息安全常识,对应帐号用户名的那个密码,真正的说法应该是口令,只是很多地方以讹传讹罢了,和加密/解密的密码是两回事)
      
      浏览代码:<INPUT type=file>效果:


      

      
      重置:<INPUT TYPE=RESET>(填好上述框值后点此填好的就不见了)
      提交:<INPUT TYPE=SUBMIT>(点提交返回结果跳转到其他页面了)
      隐藏:<span style='display:none;mso-hide:all'><INPUT TYPE="HIDDEN"></span>
      文本域:<TEXTAREA>文字</TEXTAREA>(这些都没什么大用处,在晋江,最后者不支持,不要用)
      
    <SELECT>
    <OPTION>1</OPTION><OPTION>2</OPTION><OPTION>3</OPTION>
    </SELECT>
      效果:


      说明:
      1.<select></select>之间是选项整体
      2.<option></option>之间是一项

      如果想要默认显示第2个,就在第2个的

  • 昵称:
  • 评分: 2分|鲜花一捧 1分|一朵小花 0分|交流灌水 0分|别字捉虫 -1分|一块小砖 -2分|砖头一堆
  • 内容:
  •             注:1.评论时输入br/即可换行分段。
  •                 2.发布负分评论消耗的月石并不会给作者。
  •             查看评论规则>>