Vienna Lite 2をカスタマイズ

23:03:00 Add Comment

下記を変更してトップのメニューバーを非表示にした。領域を維持して非表示にする場合は「visibility: hidden;」にする。

<div class='viennalitetop-wrapper'>

<div class='viennalitetop-wrapper' style='display: none;'>

シンプルをレスポンシブ化する

21:46:00 Add Comment

やってみたけれど、効果なし。2016-03-19 21:45

参考: え、それだけ？bloggerをレスポンシブデザインにする超簡単なカスタマイズ法

<head>タグ内に下記を追加

<meta content='width=device-width, initial-scale=1.0' name='viewport'/>

「]]></b:skin>」の上に、以下のコードをコピーする。

@media screen and (max-width: 768px){.limit-width{margin:0 auto;width:100%;overflow:hidden;}#outer{padding:0;}#main-outer{float:none;margin:0;}#main{margin:0;}#forcus-category-outer{display:none;}#header-inner{padding:10px 0;}#header-inner h1{font-size:150%;}.post-header h2{font-size:130%;}.post-body iframe{width:95%;}#upper-nav-outer{display:none;}.index-pager .newer a, .index-pager .older a{padding:20px 20px;}#related-post span.label{display:none;}#footer-inner{padding:30px 0 15px 0;}#sidebar-outer{float:none;margin:10px 0 0 0;width:100%;}#related-post li{font-size:80%;}fixed-social-bottons{display:none;}img{max-width:100%; height:auto;}}