如何制作自适应网站?
1、运行PhpStorm工具,新建一个css文件/public/css/w.css,添加如下代码:
@media screen and (max-width: 640px) {
}
2、在PhpStorm工具中,打开dedecms网站的所有模板文件,添加css文件w.css的引用。
<link rel="stylesheet" type="text/css href="{dede:global.cfg_cmsurl/}/public/style/w.css" />
3、在模板文件中,<head></head>的中间添加下面这样代码。
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
4、编辑/public/css/w.css样式文件,在
@media screen and (max-width: 640px) 这段代码的大括号中写手机版样式。
手机版样式书写完成,网站自适应手机访问就做好了。
1、1、<head></head>之间添加代码: <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
2、新建css样式,引入到各个模板中:<link rel="stylesheet" type="text/css href="{dede:global.cfg_cmsurl/}/public/style/w.css" />
3、在w.css中重写css样式,适应手机访问所需。
声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
阅读量:82
阅读量:75
阅读量:88
阅读量:94
阅读量:37