H5代码编写标准步骤

本文介绍了构建H5页面的标准步骤,从根据原型图摆放HTML元素,如div、img、input和button,到为控件添加响应并设置id实现功能,如JavaScript的onSubmit事件处理。接着,详细阐述了如何根据UI设计图进行界面调整,添加CSS样式,包括创建自定义css文件(如mycss.css)并应用到各个元素,以实现精确布局和美化界面。
摘要由CSDN通过智能技术生成

1. 根据原型图,在html的body中摆上一堆div等控件

<div>

  <img src=""></img>

  <input></input>

  <button>提交</button>

</div>

<div>

  我同意本协议

</div>

-----------------------------

效果如下图:


2.给控件增加响应,给要访问的控件增加id,实现功能。

...

<input  id=content></input>

<button onClick=onSubmit()>提交</button>

...

<script>

  function onSubmit(){

     var content = document.getElementById("content");

     var text = content.get();

    ......

     alert("success!");

}

</script>

3.根据UI设计图细调界面,加入一堆css

(1)加一个文件mycss.css

.icon{

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值