不是随便添加句话就可以自适应手机屏幕的,没这么简单。如果要自适应手机,是要用到rem单位的,然而rem又要搭配媒体查询来使用。
创新互联建站主要从事成都做网站、网站建设、网页设计、企业做网站、公司建网站等业务。立足成都服务立山,十余年网站建设经验,价格优惠、服务专业,欢迎来电咨询建站服务:13518219792
例如你的设计稿如果是宽720px的话,那你的文字就要以原始大小除以11.25,例如16px的话就要16/11.25这样来计算。我的意思是不用像素,用rem,因为px是写死的,rem是可以适应手机端的(包括盒子的宽高都是要以rem来计算)。另外,用之前要把下面这段代码放到你css文件里:
@media only screen and (max-width: 1080px) {
html, body {
font-size: 16.875px;
}
}
@media only screen and (max-width: 960px) {
html, body {
font-size: 15px;
}
}
@media only screen and (max-width: 800px) {
html, body {
font-size: 12.5px;
}
}
@media only screen and (max-width: 720px) {
html, body {
font-size: 11.25px;
}
}
@media only screen and (max-width: 640px) {
html, body {
font-size: 10px;
}
}
如果宽是720,就除以它相对应的那个值,如果是宽960,就除以960相对应的那个值,这么说应该可以明白吧。
纯手打,望采纳~
可以用 link rel="stylesheet" type="text/css" href="xxx.css" / 链接CSS,这个取决于网速。与系统无关。
style type="text/css"也可以。
[img]打开网站根目录
进入static/image/mobile文件夹
mobile文件夹中有一个style.css,这个就是您要找的文件discuz手机触屏版的css样式
下面是操作图文演示
想要固定在底部用 position:fixed; bottom:0;
但是这里有一种情况,就是当手机键盘弹出时,可能影响你的垂直布局,不过目前并没有办法监控键盘是不是弹出来了。所以也只能勉强用 position:fixed; bottom:0;