网页开发

Items filtered by date: 2月 2018

自适应网页就是针对不同的设备定义不同的CSS样式,让同一个URL网址在不同的设备上都能较好的展示,传统的方式针对电脑用户制作PC版网站,针对手机用户制作移动网站的做法有很大的局限性,而且对网站主来说工作量太大,涉及到两个站使用一个数据库,分别制作两套模板的问题,而自适应网页的设计只需通过CSS来实现。

下面这个是最简单的PC版网站结构:

Published in HTML

在HTML源文件中的头部head加入:

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

具体meta标签的含义自己可以查一下,学习一下,根据自己的情况设定。

2. 给对应的屏幕尺寸写单独的代码css样式表里写:@media screen and (min-width:640px){这里面写手机端标签的代码,例如,body{font-size:18px}, banner{width:640px}},根据自己的需求调整下字体大小,尺寸等。

 

注:@media标签要放在PC样式的下方,不然模式识别前面的标签会导致PC也显示这个样式。

 

响应式网站用框架比较方便,对于各个屏幕的大小需要做之前好好规划,应用百分比让网站自适应,缺点但不利于SEO,显示内容与PC、PAD基本都是一致的内容。

Published in HTML

关于CNERIS

CNERISYIF LINE公司的旗舰项目. 他是由IT行业不同区域的顶尖专家组成的. 我们的团队包括程序员,系统管理员,平面设计师, ERP集成服务。