现有织梦老pc网站如何修改网站模板为自适应手机端屏幕,有以下几种方法:
工具/技能
编辑器:notepad++、dw等
技能:html、css熟练
方法/步骤
1、打开自己网站头部文件,在head标签中添加代码:
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
2、修改css文件加入手机端显示的css样式就可以了
元素在pc端宽度为1440px,在css文件中加入手机端样式:@media (max-width: 640px){中间为css样式代码},
.container {
width: 1440px;
margin: 0 auto;
position: relative;
}
@media (max-width: 640px)
.container {
width: 100%;
padding: 0 6%;
}
从网页的上面到下面依次给每个元素添加手机端样式代码,使用媒体查询功能让网页在不同屏幕尺寸展示不同的样式@media (max-width: 640px){中间为css样式代码},max-width: 640px为最大屏幕宽度640的时候显示的样式。