上次在pythonanywhere上掛上去的頁面,是這個樣子的
而在手機上看是這個樣子的
總之簡直不能看= =
看了一下學校幾個微信公眾號的頁面。都是用的bootstrap,好吧我也去試試看好了。
在bootsrtap首頁找到一個叫bootstrap表單構造器的玩意兒,好像能夠拿來用用。。
於是在深夜我搭了一個這種玩意兒
好吧確實比我寫的好看多了只是看起來怎么這么詭異呢。並且並不像能適配移動端的樣子。
想了非常久決定把頁面拆開來。第一頁放兩個button作為入口。其它的操作放在二級頁面分開來弄應該會好一些。
首先弄了兩個button。在button外面加上a標簽,結果發現按下去不能跳轉,后來把外面的form刪掉了就好了,ummmm
在電腦上改變瀏覽器的大小看上去沒什么問題。可是手機打開之后還是
太 小 了。
百度了半天最終找到解決的方法
在移動設備瀏覽器上。通過為視口(viewport)設置 meta 屬性為user-scalable=no能夠禁用其縮放(zooming)功能。這樣禁用縮放功能后。用戶僅僅能滾動屏幕。就能讓你的站點看上去更像原生應用的感覺。注意,這種方式我們並不推薦全部站點使用,還是要看你自己的情況而定!就是在head標簽里加上這么一段,就好了
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">