百度禁止轉碼的代碼
最近一直在研究自適應的網站，在論壇查到百度禁止轉碼的代碼，以及自適應的一點知識，現在貼出來，分享給大家。
第一步，把如下代碼直接復制到<head></head>里面。
<meta http-equiv="Cache-Control" content="no-transform" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=yes" />
前面兩個meta，no-siteapp和no-transform，是告訴搜索引擎不要把網頁轉碼。第三個meta，聲明網頁可以縮小放大。
第二步，在<head></head>里加上如下css代碼。
<style type="text/css">
@media(max-width:960px)
{
}
</style>
這段css代碼，意思是在屏幕寬度小于960px的時候執行的樣式，當然你可以把960px改為其他更小的寬度，例如760px。
接下來，我們要做的就是把那些不需要在手機網頁上顯示的內容隱藏掉。如何隱藏？這就需要看懂網頁的html代碼了，需要分析每一個模塊使用的div，例如頭部的div、導航欄的div、正文的div、側欄的div、頁腳的div，然后，就使用css隱藏不用顯示的div，代碼很簡單，就是display:none。
手機網頁只需顯示正文，把其他部分全部隱藏，代碼如下：
<style type="text/css">
@media(max-width:960px)
{
/* 網頁全屏顯示 */
body {width:100%;}
/* 正文全屏顯示 */
#divMain{width:100%}
/* 為了避免正文圖片超出屏幕寬度 */
/* 正文圖片寬度最多是屏幕寬度的90% */
#divMain img{max-width:90%}
/* 隱藏頭部、導航、側欄、頁腳 */
#divHead{display:none}
#divNav{display:none}
#divSide{display:none}
#divBottom{display:none}
}
</style>
這樣，當在手機瀏覽網頁時，就只顯示正文了。不過要把手機網頁自適應得有頭有尾，你還需要補充編寫一些代碼，例如編寫針對手機網頁的頭部、導航和頁腳的div，編寫后默認為隱藏，在手機里再顯示。
<style type="text/css">
/* 默認隱藏手機版頭部、導航和頁腳 */
#divHead_mobile{display:none}
#divNav_mobile{display:none}
#divBottom_mobile{display:none}
@media(max-width:960px)
{
/* 網頁全屏顯示 */
body {width:100%;}
/* 正文全屏顯示 */
#divMain{width:100%}
/* 為了避免正文圖片超出屏幕寬度 */
/* 正文圖片寬度最多是屏幕寬度的90% */
#divMain img{max-width:90%}
/* 隱藏頭部、導航、側欄、頁腳 */
#divHead{display:none}
#divNav{display:none}
#divSide{display:none}
#divBottom{display:none}
/* 顯示手機版頭部、導航和頁腳 */
#divHead_mobile{display:block}
#divNav_mobile{display:block}
#divBottom_mobile{display:block}
}
</style>
微夏
百度轉碼有時其實也很糟糕2016-12-19 18:15 回復