怎么制作html5手机页面？

html-css019

怎么制作html5手机页面？,第1张

1、打开百度，在百度上搜索：易企秀，然后点击搜索，在搜索的结果中点击进入易企秀的官方网站。

2、进入后，先登录自己的账号，可以直接用QQ微信登录即可，登录后就可以开始制作自己的手机网页微场景了。

3、首先点击【我的场景】接着点击【制作场景】，接着会进入场景模板选择界面，里面有很多免费的模板。

4、可以在模板中心选择一个自己需要的点击，直接套用模板，也可以选择自己创建一个空白页面。

5、进入后就可以根据自己的需要，将模板里面的文字图片和音乐替换成自己需要的即可，如图所示。

6、还可以给自己的手机网页添加背景音乐，动画效果，跳转链接，特效组件等等。

首先需要div布局，HTML布局：

<!DOCTYPE html>

<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"><title>背景图片自适应</title><style type="text/css">html,body {padding: 0margin: 0}div {width: 100%height: 300pxbackground: url('images/slide_01_640x340.jpg') no-repeatbackground-size: 100% 100%}</style></head><body><div></div></body></html>

2.HTML代码的截图效果：

3.自适应最重要的样式如下：

<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">

width: 100%

background-size: 100% 100%

4.最终的效果是这样：