版型  

  

要製作一個完整的版型,

有許多細緻的工夫要做.

但如果只是更換

版型上方的圖片就容易多了.

 

下面我以自己新製作的版型

"有你陪伴 真好"為例,

把更換的方法說明.

為有興趣更換版型圖片的格友們

增添一點玩部落格的趣味.

 

說簡單很簡單,只要知道版型語法上方

三個數據的位置就行了.

(請見下面語法已標紅色的地方)

 

也就是說版型圖片的尺寸:

1280像素   高540像素

(寬度不要變,高度可以有一些不同)

 

你的圖片要在這個尺寸中,

高度若不是540像素,

你就把540數值改成你圖片的高度.

 

我的版型語法有兩款,

一款圖片寬的尺寸是1350像素,

一款是1280像素.

你可以任選一款版型語法更換圖片.

(寬度都按照原語法不要變)

 

你弄好的圖片要上傳到網上空間,

取得語法後,貼在下方括號

紅色的位置內.

 

然後要把版型的語法完整複製,貼上,

就可以完成你更換版型圖片了.

 

網上空間是個較麻煩的問題,

以前有隨意窩可以搞定,

現在要每個月交錢才可以使用圖片連接.

 

有格友向我介紹了這個網上空間

https://imgur.com/

你可以在google 把它翻譯成中文使用.

  

如果你更換圖片成功了,

請記得來通知我去參觀呀!

 

fgx83  

 



有你陪伴 真好三欄位版型語法


(
只例出了此版型語法上方一部分)

 

 

#comment-form table{width: 96% ;margin: 0 auto ;}
#comment-form td , #comment-form th{border: 1px solid #A28368 ;padding: 3px 5px;}
#comment-form input#send-comment{padding: 3px 5px ;}
.article-content p{
margin-bottom:1em;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
margin:0;
padding:0;}
table {
border-collapse:collapse;
border-spacing:0;}
td {
border: 1px solid #A28368;}
fieldset,img {
border:0;}
address,caption,cite,code,dfn,th,var {
font-style:normal;
font-weight:normal;}
ol,ul {
list-style:none;}
caption,th {
text-align:left;}
h1,h2,h3,h4,h5,h6 {
font-size:100%;
font-weight:normal;}
q:before,q:after {
content:'';}
abbr,acronym {
border:0;}
pre{
font-size: 1em ;}
.article-content{
_height: 1% ;
overflow: hidden ;
_overflow: none;}
body {
color:#000;
font-size:12pt;
font-family:"Century Gothic";
line-height:180%;
background-image:url(https://pic.pimg.tw/lamkwanfai/1503885602-109960657.jpg);
background-repeat:repeat;
background-position:undefined;}
#container{
width: 1280px;
background: url("http://i.imgur.com/ebgcryJ.jpg") repeat-y left top;
margin: 0 auto;}
#container2{
background: url("") no-repeat left top;
position: relative;}
#container3 {
overflow:hidden;
position:relative;}
#main{
#main{width:1280px;margin:auto;}
#content{float:right;line-height:180%;width:700px;padding-right:10px;padding-bottom:15px;overflow:hidden;}
background:url() repeat-y center ;
overflow:hidden;
padding:1px 20px;
_height: 1%;}
body{cursor:URL();}
a:hover{cursor:URL();}
#body-div{}
a, a:link, a:visited{color:#000;text-decoration:none;}
a:hover{color:#000;position:relative;top:2px;background:url() repeat-x bottom;}
#header{
height: 540px;
padding-left: 55px;
background:url(https://i.imgur.com/3BxONnE.gif) no-repeat;
overflow:hidden;
position:relative;}

 

.........................................

 

(省略了下面的語法)

 

 

7  

 

文章來源http://hoyu528.pixnet.net/blog/post/343822825

 

 
創作者介紹

絲絲入扣的部落格

悠然絲絲入扣 發表在 痞客邦 留言(1) 人氣()


留言列表 (1)

發表留言
  • 星兒
  • 複製完貼出是這個樣子?
    很難看呢!
    我把此篇語法貼出了,
    你再去複製一遍吧!