手机制作html蓝底白字,怎么制作html5手机页面？

匿名用户

1级

2014-10-08 回答

随着CSS3的兴起，有一种叫rem的单位渐渐的出现在我们的视野中。它是一个相对单位，能实现响应式的那种。它是相对于html根元素来设置当前文字大小，或者宽高的。因为它是一个不固定值,不像PX。听说在PX这个单位在PC和移动的解析不同，所以才使用rem的。

一、header信息的设置(自适应)

1、声明信息

2、编码设置

3、移动设备特别设置(重要声明！)

Viewport说明：该设置可使我们开发出的页面/产品 大小可适应各种高端移动设备

width=device-width 为设备的宽度.

user-scalable=no/yes 此功能为用户调整缩放。默认为yes。一般设置为no

PS:初次尝试制作移动端页面。亲们，由于我没有加上面的viewport声明，结果导致页面狼狈不堪。

二、手机触摸手动滑动效果

1、触摸屏效果滚动组件(js必须包含的部分)

2、所要在手机端做滑动效果的部位(html代码部分)

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

bbbbbbbbbbbbbbbbbbbbbbbbbbb

cccccccccccccccccccccccccccc

ddddddddddddddddddddddddd

3、js代码块(改代码会在动在要加滑动效果的html代码块中自动生成一块代码)

Zepto(function($){//自动加载zepto组件

$("#hongye_nav").slider({//为html 对应的id部分最佳slider属性

autoPlay : false, //是否自动

showDot : false,

loop : true,//是否循环

});

})

4、加载slider.css样式

附：

另外一种简单的写法(适用于幻灯)

html代码部分

2、js代码部分

//创建slider组件

$('#fla').slider();

附：小知识

一、字体效果

color:#FFF 定义字体的颜色

text-shadow:0 0 2px #146F61;(css3.0特效)

CSS3.0的文字阴影 text-shadow

语法：text-shadow: h-shadow v-shadow blur color;

也就是

text-shadow：【x轴(x offset) y轴(Y offst) 模糊半径(Blur) 颜色(color)】

例如：text-shadow: 5px 5px 5px #FF0000;