高雄三民區第四區保母系統[專業幼教+證照保母]
目前因為托育時間改變為7點到7:30 因此暫停這裡的一切 歡迎到臉書找我[沈麗娟] 祝福大家如意

目前分類:語法 (31)

瀏覽方式: 標題列表 簡短摘要

本文引用自tools241 - 痞客邦 PIXNET 面版樣式(CSS) 設定(問/答) (2013/10/06更新) PIXNET 面版樣式(CSS) 設定(問/答) (2013/10/06更新)

分享: 7Headlines facebook PLURK twitter   

痞客邦 PIXNET 面版樣式(CSS) 設定(問/答)

 

 

註:
1.
本人已從 Yahoo 搬到 Xuite.
2.本人
已建立Pixnet部落格:  http://tools241.pixnet.net/blog  

    暫時做為測試之用(回答 "Yahoo知識家" 問題).

3.以下CSS內容請自行測試之.


......

 

 

 

 

 

 

 

 ......

 Q5. 側欄 "最新文章" 標題
A5:
/* 側欄 "最新文章" 標題前放                                                   "小圖

" */

......

/* 調整到適當位置,以免蓋到中欄 */
......

/* 下列提供6個小圖的網址:

http://s.blog.xuite.net/_image/blogIcon19.gif

http://s.blog.xuite.net/_image/portal/mood/mind_s5.gif

http://s.blog.xuite.net/_image/portal/mood/mind_s1.gif

http://s.blog.xuite.net/_image/portal/mood/mind_s3.gif


http://2.blog.xuite.net/2/3/1/9/25043832/blog_3331499/txt/110351276/17.gif

http://2.blog.xuite.net/2/3/1/9/25043832/blog_3331499/txt/110351276/10.gif

*/

 

/* 側欄 "最新文章" 標題顏色 */

#recent-article.hslice.box li a:link, #recent-article.hslice.box li a:visited{color:#00ffff;}


......

 

 

 

 

 

Q13.游標 (在IE模式才有效果,游標樣式的網址副檔名不一定要為ani)
A13:

 

/* 游標樣式1(4星): 沒有連結時 */

 body{cursor:url(http://bbs.flash2u.com.tw/skins/myspace/userskins/skin_472043/201012278195013231.png);}

 

 /* 游標樣式2(閃心): 側欄的連結 */

 a:hover{cursor:url(http://bbs.flash2u.com.tw/skins/myspace/userskins/skin_472043/201012277423951482.png);}

 

/* 游標樣式3(藍心): 原創:中欄 "文章標題" 的連結 */

 .title a:hover{cursor:url(http://blog.roodo.com/tools_241/4c17f94d.xls);}

 

/* 游標樣式4(紅心): 原創:中欄文章內的連結 */

.article-body a:hover{cursor:url(http://blog.roodo.com/tools_241/6b873501.xls);}

 

註:

     上列游標係由 *.ani 改副檔名為 *.png 或 *.xls 然後再上傳,

     但此變通取巧方式目前在多數網站會因檔案結構不合導致上傳失敗.

     上列網站仍會保留檔案, 網友可直接套用或下載後再上傳到他處.

 

 

 

** 除了 "隱藏" , 何不 "加料" ?

 

1.本人在舊址http://tw.myblog.yahoo.com/tools-241

   已同時使用了4種游標, 在此特別公開用法.

 

2.滑鼠移到天使變蝙蝠 ,再按左鍵回首頁.

 

3.多數blog對版面的 "絕對位置" 管控較為寬鬆, 例如:

   "前景動圖" 可以置頂, 座標負數可能有效, 但在Yahoo則受限,

   本人以獨特 "CSS HACK" 語法突破此限制,

   請參考舊址 "流星雨" 位置.

 

 

 

 

* 色碼表 ==>http://nthucad.cs.nthu.edu.tw/~yyliu/color.html

 

 

* 隨意窩 Xuite 面版樣式(CSS) 設定(問/答) ==>

        http://blog.xuite.net/tools241/blog/112234512

 

 

 

本文出自: http://blog.xuite.net/tools241/blog/112182670  (內容隨時補充)

語蝶 發表在 痞客邦 留言(0) 人氣()

本文引用自ru6854 - 教學~✿CSS 教學 > 字體 ✿~

公告版位
分享: 7Headlines facebook PLURK twitter   

http://www.1keydata.com/css-tutorial/tw/font.php

在 CSS 中常見的字體 (font) 屬性有以下幾種:

  • font-family
  • font-size
  • font-weight
  • font-style
  • font-variant

    每一個屬性在以下會有詳細地介紹:

    font-family

    font-family 屬性是用來設定字體的類別。

    CSS 樣式 顯現結果

    p {font-family: verdana;}

    Font Family Verdana.

    p {font-family: arial;}

    Font Family Arial.

    p {font-family: impact;}

    Font Family Impact.

    font-size

    font-size 屬性是用來設定字體的大小。大小可以是以數字顯現 (絕對的或是相較的均可),或是以下其中之一的值:"xx-large"、 "x-large"、 "large"、 "medium"、 "small"、 "x-small"、和 "xx-small"。

    CSS 樣式 顯現結果

    p {font-size:9px;}

    字體大小為 9px。

    p {font-size:150%;}

    字體大小為 150%。

    p {font-size:0.8cm;}

    字體大小為 0.8 cm。

    p {font-size:small;}

    字體大小為 small。

    p {font-size:large;}

    字體大小為 large。

    font-weight

    font-weight 屬性是用來設定字體的厚度。厚度的設定值可以從 100 到 900 (900 是最厚的)。另外,我們也可以將厚度設定為 bold (厚)、bolder (更厚)、及 normal (正常)。

    以下舉幾個例子:

    CSS 樣式 顯現結果

    p {font-weight: 100;}

    這是厚度 100。

    p {font-weight: 900;}

    這是厚度 900。

    p {font-weight: bold;}

    這是 bold 厚度。

    font-style

    font-style 屬性是用來設定字體是否為斜體字 (italic 或 oblique)。

    CSS 樣式 顯現結果

    p {font-style: italic;}

    這是斜體字。

    font-variant

    font-variant 屬性是用來設定文字是不是要以小型大寫 (small caps) 字體顯現。在小型大寫字體中,所有的字母都是大寫,可是字體是比一般大寫來得小。可能的值為 "small-caps" 和 "normal"。來看下面的例子:

    CSS 宣告,

    span {
      font-variant:small-caps;
    }

    以下的 HTML 碼,

    <span>initial in small caps</span> AND LATER IN LARGE CAPS.

語蝶 發表在 痞客邦 留言(3) 人氣()

置頂 教學 ~✿如何將youtube發表在痞客邦✿~

 

 

格友尋問 翔霏在此做個小教學

如何將youtube發表在痞客邦

收尋youtube 打上你要的影片 例如:"手掌心" 按下放大鏡"收尋"

01

收尋如下 首先按下【分享】 然後【崁入】 使用【舊版內崁程式码】

接著【複製語法】

02

直接複製也可 然後回到發表文章 記得要先切換編輯器貼上喔^^

04  

更深解析在往底下看 也可不需了解

再來打開【記事本】 貼上剛剛複製的語法 如下

找出"movie" value="後頭要貼上的網址 翔霏的是//www.youtube.com/v/7wvNwOPprBE

當然看寬高自己設還是跟影片一樣都可以喔!

03

示範結果如下   

, Della丁噹[手掌心]MV官方版-中視古裝大戲[蘭陵王]片尾曲 

語法解析:

<p><iframe src="影片網址" width="" height=" frameborder="0" allowfullscreen=""></iframe></p><div class="article-keyword" style="word-wrap: break-word; word-break: break-all; margin-top:20px; clear:both;"><!--文章關鍵字--><img src="小小圖示" style="vertical-align:middle;"> <a href="網址或原址" rel="tag" target="_black">上傳者</a>, <a href="作者網址" rel="tag" target="_black">敘述文章</a></div></div> 

 

更簡便

<p><iframe src="影片網址" width="560" height="315" frameborder="0" allowfullscreen=""></iframe></p>

ps:圖示提供:小小圖素材 ~ღ 文章前可愛小小圖 ღ~  

感謝您耐心看完

本文出自翔霏寶貝屋

 

語蝶 發表在 痞客邦 留言(1) 人氣()

本文引用自venus1020 - 更改版圖相片變大,我也做到了24 Tue 2013 20:59

 

分享: 7Headlines facebook PLURK twitter   

本文引用自candywjb - 更改版圖相片變大,我也做到了

 

 

1

 

搬到新家後看著各位格友將自己的家佈置的如此漂亮,

不由的我也心動想要改改門面換換裝璜,

因天兔來擾亂我的假期那兒也不能去,

那就大膽冒險的開始敲敲打打改裝我的房子吧

探索格友筠媽親愛的,我把房子變大了

沈小慧的教導,一開始我也是有看沒有懂,

摸索了好久終於將我的家佈置完成了,

相信我辦的到你們也是可以的,因為沒有想像中的難喔。

以下是我整理出來方便大家容易操作改格,

在改格之前大家一定要先原始的CSS 原始碼編輯裏的語法先複製下來

免的到時改錯了無法復原。

底下是我現在的版圖改完成的語法,大家可以參考看看。

在管理後台選自訂樣式再點CSS原始碼編輯,

進入畫面後開始找你想要變更的語法:

側邊欄位字體變大

.box-title {

height:32px;

line-height:32px;

overflow:hidden;

color:#333;     改成#000000;   這是側欄位改標題的顏色(依你喜歡的顏色變更)

background:url(http://pic.pimg.tw/candywjb/1379459591-3610034888.jpg);

padding:0 10px 3px 30px;

}

 

box-text {

color:#999;        改成9900ff  這是側欄位的字體顏色

font-size:12px;     改成13px   這是側欄位的字體大小

padding:10px;         

}

 

box-text a {

color:#777;         改成9900ff

}

 

.box-text a:hover {

color:#444;          改成9900ff

 

痞客邦主體相片系統規定尺寸為950*300

一般按照這尺寸更改,圖片都會比較小,

如果要將圖片變大那就是要升級成為VIP

現在自己勤勞一點,自己做變動吧。

版圖的尺寸改法  照片尺寸1024*379(這是我版圖的尺寸)

 

#header {

position:relative;

height:300px;            改成400px(這是放入相片大小的位置) 

background-image:url(none); 

background-color:#9f9; 

background-position:undefined; 

background-repeat:repeat; 

padding:50px 0 0; 

}

 

#banner { 

height:300px;    改成380px(這是放入相片大小的位置) 

background:url(http://d.share.photo.xuite.net/wjb519/1d556a6/6741476/387207106_x.jpg);

}

將這刪除改你想更換相片的網址(複製連結網址貼上)

將想要的圖片尺寸改為1024*379,再將照片上傳到隨意窩,

因我痞客邦裏文章上傳的圖片,已在系統設定好尺寸不想再做變動而改來改去,

所以乾脆上傳到隨意窩。

 

改相片簿   部落格   留言  名片

原本為英文字做以下變更就可改成中文

#navigation {

position:absolute; 

top:315px;   改成435px這是看你要將相片簿 部落格 留言 名片等字體要擺放在那個位子的數字 

right:40px;   

width:270px;  

height:35px;   

background:#fff url(http://pic.pimg.tw/pixnetvisual/7b50563db8d70081580c27a1f139cdc8.gif); 刪掉 

-webkit-border-top-left-radius:5px; 

-webkit-border-top-right-radius:5px;

-moz-border-radius-topleft:5px; 

-moz-border-radius-topright:5px; 

border-top-left-radius:5px; 

border-top-right-radius:5px; 

margin:0; 

padding:0 0 0 10px; 

}

  

#navigation li a {

display:block; 

width:100%; 

height:35px; 

font-size:0; 

text-indent:-5000px; 

刪掉

 

相片簿  部落格  留言  名片的中間空格距離 

#navigation li#link-album { 

width:60px; 

}

#navigation li#link-blog { 

width:50px;  改成75px(這可依你們想擺放的位子更改數字)光這些數字我喬好久

} 

#navigation li#link-guestbook { 

width:85px;  改成70px 

}

#navigation li#link-profile { 

width:65px;   改成35px 

} 

  

最新留言回覆日期的顏色 

#latest-comment li span { 

color:#bbb;     改成#666666 

font-size:.9em;   改成13 

border-right:1px solid #ddd; 

margin:0 5px 0 0; 

padding:0 5px 0 0; 

} 

 

以上是我版圖更改的語法,

每一位所選的版圖不一樣可能更改後也會有所不同,

再依你們的版圖作調整。

而每個人一開始部落格的版面不是會有個廣告欄,

有個語法貼上後就可以蓋住了,可參考 min 的 刪除左上角或右上角廣告教學

但我想再更改圖片時那個廣告就又會回來,

整個版面又要重新再更改一次,  

所以現在我這樣更改完成後,只要更改相片就可以了,

大家試試看吧~

 

語蝶 發表在 痞客邦 留言(0) 人氣()

本文引用自e314520520 - 霝兒小教學_背景樂與文章音樂錯開播放

 

霝兒很喜歡逛網頁時 一邊瀏覽資訊 一邊聆聽美妙音樂

最好是自動循環播放(因為懶的手動)

尤其愛在自己版版上 播放自己喜歡的背景樂

如此只要一進格 就能馬上聽到自己愛的歌了

霝兒偶爾也喜歡玩製框

每篇都會擺上美妙樂曲來襯托框架的獨特優美(哈 自High中)

但苦於背景樂與文章音樂混搭 聽起來可真像魔音穿腦ㄚ

聰明滴我 於是想到了一個方法

讓背景樂與文章音樂錯開播放

方法如下:

首先放上一篇置頂文(一篇就好 不要每篇都置頂喔)

其它文章想置頂霝兒也不反對啦

但要確定擺放部落背景音樂的置頂文是在可以顯示文章篇數的版面中出現

且其它文章若想播放音樂 最好音樂語法都置於文章最下方(如此才不會衝突)

然後到後台點選置頂文編輯文章

將音樂語法 置入文章最頂層 按更新 儲存文章即可

註:

音樂語法貼入後會轉換成編輯器自己自訂語法形式 不理它

以後若要換音樂 自己先編輯好後 將整段附蓋過去就好嚕

日後更換音樂 也如法炮製 如此版面音樂就不會與文章音樂互撞了

原因是 每篇文無論你顯示幾行摘要(最好選1-2行顯示)

它都會從第一行開始顯示

而文章是單篇獨立開啟的 所以它只會讀取單篇文章內容

而我將音樂語法擺放置頂文的第一行 就能當部落背景樂使用嚕

方法很簡單 大家可以試試看喔

 

先教教大家如何尋找音樂代碼

以外連XUITE影音為例

 
 
按下複製後會顯示一個頁面訊息 【複製完成】按確定 
 
再開一筆記本 將剛剛複製的訊息貼上 如下圖: ↓
 
 
 
  
落落長的語法 我們只需截取紅色框框圈起的部分(這就是影音代碼了) 
 
最後附上音樂語法 提供大家做參考
 
音樂語法如下: ↓ 
 
<embed height=1 type=application/x-shockwave-flash width=1 src=http://vlog.xuite.net/vlog/swf/lite.swf?media=影音代碼&ar=1&as=1 allowscriptaccess="never"></embed>
 
以後若想汰換音樂 只要先將上述音樂代碼找出
 
直接替換音樂語法中【影音代碼】部分即可 
 
附帶一提:
 
看一下音樂語法中的一小段語法 &ar=1&as=1
 
&ar=0&as=0 (循環1次  手動播放)
 
&ar=1&as=0 (無限循環 手動播放)
 
&ar=0&as=1 (循環1次 自動播放)
 
&ar=1&as=1 (無限循環 自動播放)
 
height=1 width=1 (則表示音樂框不顯示) 
 
若要顯示的話 請自訂寬高喔
 

   

語蝶 發表在 痞客邦 留言(1) 人氣()

本文引用自min0427 - 留言插入表情符號教學

 

 

當格子忙的不可開交,教學文章都沒時間做~

痞客這邊也忙著初步設定~

正忙著,我家臭老頭還要在旁邊問東問西~

沒空回答他,還會給句 "妳也不會吼~"

人家在忙啦~

沒想到,他竟有空做教學ㄟ~果然很閒~

偶縮~那是我教你的~我要拿過來當我發表~他強辯~

強辯無效~就當是我發表~抗議也無效~

以上是屁話~

以下是教學~

1.下載表情符號 http://beta101.com/viewthread.php?tid=432 (網路上搜尋到的)

   下載的檔案先掃毒,確定無毒之後再解壓縮。

2.到管理後台\相簿  建立新相簿,然後把下載下來的表情符號全部選取整批上傳到這本相簿

  (不需要一個一個上傳)

  例如相簿命名為 表情符號

0.jpg  

 

2-1. 用這種方式整批上傳(圖片全選一次拖拉進去即可)

       對了,最多只顯示100個,也就是說上傳200張也只能顯示100個。

6.jpg    

3.點選應用市集

1.jpg  

4.找免費的

2.jpg  

 

5.安裝留言插入表情符號

 

4.jpg      

 

 

6.按設定

 3         

  

7.指定第1步驟建立的相簿

5.jpg  

 

8.大功告成

 

PS.1.若圖下載下來,上傳之後秀不出來,可將圖片整批修改成寬度90,再上傳即可~

    2.使用回應表情時,一定要先打上字才能點表情,要不然點不出來~

      跟阿虎不一樣~不能先打上表情~

 

 

有人抗議嗎~

 

 

 

 

語蝶 發表在 痞客邦 留言(1) 人氣()

本文引用自e314520520 - 小霝兒教學_關於【留言/引用管理]         

 

相信很多人都跟我一樣會錯意了

關於後台【文章管理】→ 【留言/引用管理】部分 弄得霧煞煞

先前霝兒發的後台設定小教學 這部分解說設定有誤 在此做更正 免得誤導大家了 真抱歉

最近常聽朋友問起 為啥引用沒出現? 為啥留言也不見?

霝兒小研究了一下 發現是設定的問題

首先來到後台看看

若將留言設定為 

那麼就會和霝兒一樣 有更正不完的留言了 像這樣 ↓ 

原來 這些切換功能 是方便版主於後台自行整理之用

才不會遺漏回覆留言 才可以檢舉廣告留言

只是整理完後 千萬記得要將設定改成【只顯示非廣告留言】

否則就會有上述情形發生

(痞客邦系統會自行胡亂判定 把好友留言也當成疑似廣告留言來處理)

 

再來就是引用了

若將引用設定為【顯示所有引用】

那麼就會有如下情形發生↓ 

哈 莫名其妙全都判定為 疑似廣告  當然引用列也不會出現引用嚕

除非自己去後台整理按掉 才會在引用列中出現誰引用了文章

若將引用管理設定為【只顯示非廣告引用】

就不會有上述問題產生了

瞧 所有引用都一目了然 

當然自己也可以在後台整理這些引用、留言

整理完後 記得將設定改回

通通設定在【只顯示非廣告留言】、【只顯示非廣告引用】

 

希望這點小說明能幫大家解惑嚕

 

補充說明:

常聽格友該該叫 說是明明引用了 卻不見引用列中有他(她)的引用出現

這問題出現在版主身上

還是得經常去後台整裡引用列 將【引用管理】拉至【顯示所有引用】查看

若被設為廣告引用的話 就得解除 才會出現在引用列上

目前只知道是如此

唉 只能說 痞客檔廣告檔的太兇了

只好辛苦版主們 多多留意自己的後台留言引用喔

 

                                                                         

 

                                                                                                                                                    

語蝶 發表在 痞客邦 留言(10) 人氣()

 

 

本文引用自e314520520 - 有關痞客邦【後台設定小教學】

 

 

初來乍到 對這兒一切都很陌生

 

經過幾日摸索 加上格友們的文章分享 霝兒將這幾天來的心得 做一整合

 

1.版位公告

 

點選【管理後台】→【側邊欄位設定】

 

在中間那塊【內容欄】中有三個設定區塊 點選【公告版位】設定

 

此版塊支援《Html語法》可放圖片、音樂等等 範例如下:

 

 

2.文章引用

 

其實與奇摩大同小異 首先將文章整段複製 拉至文章最下方 有個【我要引用】

 

 

按下後 直接將整段文章貼於【本文引用自XXXXX】後方

 

 

然後 刪掉文章中最上方紅框圈起處 如下圖:↓

 

 

標題填上 做好分類設定等等 按【發表文章】即可 (是不是跟阿虎引文很類似呢)

 

3.頭像設定/更改暱稱

 

點選【管理後台】→【管理首頁】 在這裡可直接做更換

 

 

4.留言/引用管理

 

點選【管理後台】→【留言/引用管理】

 

做如下設定 【顯示所有留言】【顯示所有引用】

 

 

當然這裡也可以觀看到所有引用人及留言

 

若對方是用悄悄話 那麼妳的回覆也會自動轉為悄悄話喔

 

除非另外針對留言做勾選 設定為【取消悄悄話】 那麼就會變成公開回覆了

 

5.小掛件

 

很多格友詢問 小掛件要如何放上 霝兒簡易做說明

 

點選【管理後台】→【側邊欄位設定】 按右上的【新增版位】

 

 

輸入掛件語法或音樂語法

 

 

然後用拖曳方式將掛件拖放到想要的位置上即可

 

6.如何整理文章

 

既然有格友問起 霝兒就小做說明  

 

點選【管理後台】→【文章列表】

 

 

首先自訂數個資料夾 分類好

 

然後逐一將文章丟到你想存放的資料夾中即可

 

如此也方便自行管理文章喔

 

7.製做留言版表情符號

 

請參考以下這篇【留言插入表情符號】 霝兒就不另外做教學了

 

http://kobayasitenmei.pixnet.net/blog/post/159600794%20

 

8.取消留言驗證碼

 

 點選【管理後台】→【基本/進階設定  】 

 

 

 9.如何貼引用語法

 

在引用語法框框中輕點3下 複製語法 接著按引用

 

 

 點選編輯器中的【HTML】將整段語法貼入 按更新 如下圖: ↓

 

 

 

 

 然後儲存文章即可 (是不是更簡易方便呢)

 

10.解除文章鎖右鍵

 

點選【管理後台】→【基本/進階設定 】 

 

 

點選【開放滑鼠右鍵】否則會導致他人無法引文喔

 

除非文章不想被引用

 

 

 

霝兒整理分享

 

 

語蝶 發表在 痞客邦 留言(9) 人氣()

 

黑色
#000000
艾莉斯藍
#F0f8ff
灰綠色
#008b8b
淺黃
#Ffffe0
珊瑚
#Ff7f50
黑灰
#696 969
薰衣草
#E6e6fa
水鴨
#008 080
淺金黃
#Fafad2
西紅柿
#Ff6347
灰色
#808080
淺鋼
#B0c4de
深青灰
#2f4f4f
粉黃
#Fffacd
橙紅
#Ff4500
深灰
#A9a9a9
青灰
#778 899
深綠
#006 400
小麥
#F5deb3
紅色
#FF0000

#C0C0C0
青灰
#708 090
綠色
#008000
原木色
#Deb887
赤紅
#Dc143c
淺灰
#D3d3d3
鋼青
#4682b4
森林綠
#228b22
黃褐色
#D2b48c
暗紫
#C71585
亮灰
#Dcdcdc
紅深藍
#4169e1
海藻綠
#2e8b57
黃褐色
#F0e68c
深粉紅
#Ff1493
白霧色
#F5f5f5
黑藍
#191 970
暗海藻
#3cb371

#FFFF00
暗粉紅
#Ff69b4

#FFFFFF
海軍
#000080
草綠
#66cdaa

#Ffd700
淺紫紅
#Db7093

#Fffafa
深藍色
#00008b
海藻綠
#8fbc8f

#Ffa500
粉紅色
#Ffc0cb
ghostwhite
#F8f8ff
暗藍
#0000cd
海藍寶石
#7fffd4
黃褐
#F4a460
淺粉紅
#Ffb6c1
花白
#Fffaf0
藍色
#0000FF
淡綠
#98fb98
深橙
#Ff8c00

#D8bfd8
亞麻布
#Faf0e6
寶藍
#1e90ff
淺綠
#90ee90
黃花
#Daa520
品紅
#FF00FF
古董白
#Faebd7
矢菊花
#6495ed
嫩綠
#00ff7f
秘魯
#Cd853f
紫紅色
#FF00FF
粉木瓜橙
#Ffefd5
深天藍
#00bfff
嫩綠
#00fa9a
深金黃
#B8860b
紫色
#Ee82ee
杏仁白
#Ffebcd
天藍
#87cefa
草綠
#7cfc00
巧克力
#D2691e

#Dda0dd
濃湯
#Ffe4c4
天藍
#87ceeb
黃綠色
#7fff00

#A0522d
蘭花
#Da70d6
莫卡辛
#Ffe4b5
淺藍色
#Add8e6
綠黃
#Adff2f
saddlebrown
#8b4513
蘭花紫
#Ba55d3
印地安
#FFDEAD
灰藍
#B0e0e6
石灰
#00FF00
栗色
#800000
深蘭花紫
#9932cc
粉桃紅
#Ffdab9
淡藍綠
#Afeeee
暗綠
#32cd32
深紅
#8b0000
深紫
#9400d3
粉玫瑰紅
#Ffe4e1
淺青綠
#E0ffff
黃綠
#9acd32
棕色
#A52a2a
洋紅
#8b008b
淡紫
#Fff0f5
青色
#00FFFF
深橄欖綠
#556b2f
耐火磚
#B22222
紫色
#800080
貝殼
#Fff5ee
AQUA
#00FFFF
淡綠褐
#6b8e23
印地安
#Cd5c5c
靛青
#4b0082
舊布黃
#Fdf5e6
綠松石
#40e0d0

#808 000
玫瑰褐
#Bc8f8f
深青藍
#483d8b
象牙
#Fffff0
粉藍
#48d1cc
深卡其色
#Bdb76b
深橙紅
#E9967a
藍紫
#8a2be2
蜜瓜
#F0fff0
墨綠色
#00ced1
淡金黃
#Eee8aa
淺珊瑚紅
#F08080
暗紫
#9370分貝
薄荷乳白
#F5fffa
海藻綠
#20b2aa
玉米穗黃
#Fff8dc
三文魚
#Fa8072
青藍
#6a5acd
蔚藍色
#F0ffff
藏青
#5f9ea0
米色
#F5f5dc
橙紅
#Ffa07a
青藍
#7b68ee
 
 
 
               18  
 
                              
文章標籤

語蝶 發表在 痞客邦 留言(0) 人氣()

 

本文引用自sandyjane388 - 痞客邦部落格版型 CSS語法對照表 雜蒐

 

        訊,包 含﹝樣   者、樣   態﹞...   訊。 

/*------------------- #Generate By Pixnet ------------------------ */
/*------------------------ #comment-table ------------------------ */
#comment-form table { width: 96% ; margin: 0 auto ;}
#comment-form td , #comment-form th { border: 1px solid #555 ; padding: 3px 5px; }
#comment-form input#send-comment { padding: 3px 5px ; }

.article-content p{
margin-bottom:1em;
}
/*------------------------ #Generate End ------------------------ */
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;
}
fieldset,img {
border:0;
}
address,caption,cite,code,dfn,em,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;
}

/***************************************************/
* PIXNET blog template for Fahrenheit Blog Design Contest.

* Version: 1.1
* Author: Lee, Yim Chi
* Email: yclee82@yahoo.com
* Website: http://blog.pixnet.net/wannebe
***************************************************/

* {
padding: 0;
margin: 0;
}

 

      

body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: small;
﹝字體大小﹞
background: #FFF
﹝背景顏色﹞
url(http://i390.photobucket.com/albums/oo347/RuNm8v7/
blog%20background%20use/32x32-1.jpg)
{背景圖片﹝網址﹞}
repeat top left;
{背景圖片﹝重複、置頂、靠左﹞}
cursor:URL(http://www.geocities.jp/linda5437love/52linda0072.ani);
{滑鼠﹝網址1﹞}
color: #444;
}

a {
color: #657CFC;
text-decoration: none;
}

a:hover {
text-decoration: underline;
{滑鼠移至連結時﹝沒有底線﹞}
cursor:url(http://sky.geocities.jp/lovetyhgf/1.cur);
{滑鼠﹝網址2﹞}
}

 

 

   台﹝發表新文章管理後台 

#authority {
background: url(http://link.photo.pchome.com.tw/s12/vevz09b/
30/126833441090/)
{背景圖片﹝網址 
no-repeat{背景圖片﹝不重複 
bottom center;height: 38px;
{背景圖片﹝高度 
text-align: right;
文字靠右
padding: 22px 190px 12px 20px;
{背景圖片﹝上、下、左、右﹞的距離}
font-size: 20px;
{﹝字體大小﹞}
}

#authority a {
color: #b51c4f;font-weight:bold;
margin-right: 10px;
}

 

      

#container {
width: 980px;
margin: 15px auto 25px auto;
background-color: #FFF;
border: solid 1px #999;
}
{所有內容區塊1

#container2 {
margin: 0;
padding: 0;
}
{所有內容區塊2

#container3 {
margin: 0;
padding: 10px; 
}
{所有內容區塊3 

 

橫 幅 

#header {
position: relative;
width: 100%; 
margin-bottom: 15px; 
}
{上方﹝橫幅區塊﹞}

#login-bar {
font-size: 80%;
text-align: right;
margin-bottom: 10px; 
}
{上方﹝登入區塊﹞}

#banner {
background: #FFF
﹝背景顏色﹞
url(http://i390.photobucket.com/albums/oo347/RuNm8v7/
blog%20banner/yam/vevz09/-vevz09-Banner-1-1.jpg) 
{背景圖片﹝網址﹞}
no-repeat top left; 
{背景圖片﹝不重複、置頂、靠左﹞}
height: 620px;
{背景圖片﹝高度﹞}
padding: 15px 20px;
{背景圖片 - 距離整個橫幅區塊的﹝上、下、左、右﹞的距離}
}

#banner h1 {
font-size: xx-large;
 字體大小
font-style: italic;
 字體風格
font-family: "Simhei", sans-serif;
 字型
font-weight: 800;
 標題區塊寬度
}
{網誌標題﹝字體大小、字型、風格、標題區塊寬度﹞}

 

#banner h1 a, #banner h1 a:hover {
color: #6600FF;
連結字體顏色
text-decoration: none;
刪除連結底線
}
{網誌標題﹝連結狀態﹞}

 

#banner h2 {
color: #0066FF;
字體顏色
padding: 16px 0px;
 網誌描述的位置
font-size: 16px;
 字體大小
WIDTH: 420px; 
 網誌描述區塊的寬度
letter-spacing : 3pt; 
 每個字之間的距離
BACKGROUND-IMAGE: url(http://link.photo.pchome.com.tw/
s12/vevz09b/24/126833956229/);  
 網誌描述區塊的背景圖片網址
}
{網誌描述﹝字體顏色、大小、字型、風格、標題區塊寬度、背景圖片﹞}
 

 

    

.skiplink {
position: absolute;
top: 0;
left: 0;
font-size: 80%;
}

 

 

   -    

#blog-category {
position: absolute;
bottom: 5px; 
right: 10px;
font-size: 80%;
color: #FFF;
}

#blog-category a {
color: #990202;
}
字體顏色

#blog-category a:hover {
color: #E6BE20;
連結字體顏色
}

 

       

#navigation {
position: absolute;
left: 0; 
bottom: 30px;
float: left;
width: 930px;
background: #000 url(http://00000000.gif) repeat-x left top; 
padding: 2px 15px;font-size:20px;letter-spacing : 5pt;
}
橫幅下方的四個主要頻道相簿、部落格、留言、名片﹞}

#navigation li {
float: left;
margin-right: 15px; 
}

#navigation li a {
float: left;
display: block;
padding: 8px 15px;
color: #FFF;
font-weight: 700;
}

#navigation li a:hover {
color: #E6BE20;
text-decoration: none; 
}

#navigation #link-album a {
background: url(http://pic.pimg.tw/wannebe/1199061866.gif) no-repeat left center;
padding-left: 123px;
}
橫幅下方的四個主要頻道相簿未連結時的背景圖片﹞}

#navigation #link-album a:hover {
background: url(http://pic.pimg.tw/wannebe/1199061867.gif) no-repeat left center;
}
橫幅下方的四個主要頻道相簿連結時的背景圖片﹞}

#navigation #link-blog a {
background: url(http://pic.pimg.tw/wannebe/1199062480.gif) no-repeat left center;
padding-left: 86px; 
}
橫幅下方的四個主要頻道部落格未連結時的背景圖片﹞}

#navigation #link-blog a:hover {
background: url(http://pic.pimg.tw/wannebe/1199062481.gif) no-repeat left center;
}
橫幅下方的四個主要頻道部落格連結時的背景圖片﹞}

#navigation #link-guestbook a {
background: url(http://pic.pimg.tw/wannebe/1199063111.gif) no-repeat left center;
padding-left: 187px; 
}
橫幅下方的四個主要頻道留言板未連結時的背景圖片﹞}

#navigation #link-guestbook a:hover {
background: url(http://pic.pimg.tw/wannebe/1199063125.gif) no-repeat left center; 
}
橫幅下方的四個主要頻道留言板連結時的背景圖片﹞}

#navigation #link-profile a {
background: url(http://pic.pimg.tw/wannebe/1199062484.gif) no-repeat left center;
padding-left: 133px; 
}
橫幅下方的四個主要頻道版主名片未連結時的背景圖片﹞}

#navigation #link-profile a:hover {
background: url(http://pic.pimg.tw/wannebe/1199062485.gif) no-repeat left center; 
}
橫幅下方的四個主要頻道版主名片連結時的背景圖片﹞}}

 

 

#main {
clear: both; 
width: 960px; 
padding: 0 0 10px 0;
margin: 0;
float: left;
}

#content {
width: 650px;
float: left;
padding: 0;
margin: 0 50px 0 0;
}
 

 

    

.article-head a, .article-content a {
color: #990202;
}

.article-content a:hover {
color: #E6BE20;
}

#article-area, #article-box {
margin: 0;
padding: 0; 
float: left;
width: 650px; 
}

.article {
padding: 0;
margin-bottom: 30px;
clear: both;
float: left;
width: 650px;
}

.article-head .publish {
font-size: 70%;
text-align: right;
margin-bottom: 3px;
padding: 0;
color: #666;
}


.article-head .title h2, h3.article-area-title{﹝文章標題﹞} {
font-size: 120%;
font-weight: bold;
margin-bottom: 10px;
background: url(http://link.photo.pchome.com.tw/s12/
vevz09b/30/126832959941/) 
文章標題標題圖框﹞}
no-repeat left center;標題圖框不重複、靠左﹞}
padding: 0 0 0 56px;
border-bottom: solid 0px #b51c4f;
margin-bottom:20px;letter-spacing : 1pt;

padding:56px;
}
標題圖框整體位置﹞}

.article-body {
margin-bottom: 5px;
}
標題圖框整體位置﹞}

.article-body .author {
font-size: 90%;
text-align: right;
color: #666;background:url() left top repeat; 
}

.article-footer {
float: left;
text-align: right;
font-size: 80%;
color: #666;
width: 100%;background:url(http://i390.photobucket.com/albums/oo347/RuNm8v7/blog%20background%20use/10-02-01-012.png) left top repeat; border-bottom: solid 6px #b51c4f;
}
文章附加資訊﹞}

.article-footer .refer {
float: left;
}
文章分類分類資料夾﹞}

.article-footer .refer li {
float: left;
margin-right: 15px;
}
文章分類資料夾個人分類﹞}

.article-footer .back-to-top {
float: right;
}

#user-post {
clear: both;
}
{﹝文章回應區塊﹞}

#trackback-box {
margin-bottom: 15px;
}
{﹝回到首頁﹞}

#trackback-box h3, #comment-box h3 {
font-weight: bold;
margin-bottom: 10px;
}
{﹝留下回響﹞}

.page {
clear: both;
margin: 10px 0 0 0; 
text-align: center;
}

 

 

#content .main-list, #content .main-list table {
width: 100%;
}

#content .main-list th {
background-color: #DDD;
font-weight: bold;
padding: 5px 10px;
}

#content .main-list td {
padding: 3px 10px;
border-bottom: solid 1px #DDD; 
}

 

 

#links {
width: 250px;
display: inline;
float: right; 
}
 

 

   位{含﹝自由欄位﹞}

.box {
margin-bottom: 20px;
border-bottom: solid 5px #b51c4f;
padding-bottom: 10px;
clear: both;
width: 250px;
}

.box-title{color: #b51c4f; 側邊欄位標題 - 標題文字顏色
background:url(http://link.photo.pchome.com.tw/s12/
vevz09b/30/126833114597/) 
側邊欄位標題圖框
no-repeat;
側邊欄位標題圖框 - 不重複
text-align:left;
側邊欄位標題圖框 - 靠左
height:55px;
側邊欄位標題圖框 - 高度
font-size:medium;letter-spacing : 2pt;
側邊欄位標題 - 標題文字大小、每個字之間的距離
font-weight:700;
側邊欄位標題圖框 - 整體寬度
padding:26px 0 0 56px;
側邊欄位標題圖框 - 位置與距離
}

.box-text {
padding: 0 10px;
}
側邊欄位每一小區塊文字 - 位置與距離

.box .inner-box {
margin-bottom: 10px;
}

.box-more {
clear: both;
font-size: 80%;
text-align: right; 
}
側邊欄位 - 文章分類區塊 - 開合按鈕 - 位置與距離
 

 

     

.more {
text-align:right;
background:#fff 
文章繼續閱讀 - 背景顏色
url(http://i390.photobucket.com/albums/oo347/RuNm8v7
/blog%20guestbook%20use/t_09.gif) 
文章繼續閱讀 - 前方動態圖片
no-repeat;
文章繼續閱讀 - 前方動態圖片 - 不重複
padding-right:508px;
}
文章繼續閱讀 - 整體寬度


 

 

月 曆

#links #calendar table {
width: 100%;
}
月曆

#links #calendar th, #links #calendar tr {
text-align: center; 
}

#links #calendar .month-nav th, #links #calendar .month-nav a {
color: #E6BE20;
font-weight: bold;
}
月曆 - 月份的文字設定

#links #calendar .weekday th {
font-weight: bold;
}
月曆 - 星期的文字設定

#links #calendar .today, #link #calendar .today a {
color: #990202;
font-weight: bold;
}
月曆 - 日子的文字設定
 

 

  

#links #murmur .murmur-time {
font-size: 75%;
color: #666;
}
碎碎念的時間 - 文字大小、顏色、設定

#links #mylink ul {
margin-left: 10px;
}
碎碎念的連結與位置設定

 

 

#links #crumb li, #links #crumb li a {
display: block;
}

 

 

#footer {
clear: both;
width: 100%;
border-top: dashed 1px #999;
padding-top: 10px;
margin-top: 10px;
font-size: 90%; 
text-align: center;
}

#footer a {
color: #999;
}

 

     

.post-comment{
font-size: 0pt; 
MARGIN: 10px 0px 10px 10px;
height:40px;
TEXT-ALIGN: RIGHT;
}

 

      

.post-comment a{
DISPLAY: block; 
BACKGROUND: url(http://p5.p.pixnet.net/albums/userpics/5/8/29758/1195056268.jpg) no-repeat 0px 0px ; WIDTH: 300px; height:40px; 
font-size: 0px;
}

 

         

TEXTAREA
{
BORDER-RIGHT: rgb(153,153,153) 1px solid; BORDER-TOP: rgb(153,153,153) 1px solid; FONT-SIZE: 16px;letter-spacing : 3pt;font-weight:bold; BACKGROUND-IMAGE: url(http://link.photo.pchome.com.tw/s12/vevz09b/24/126833771323/); BORDER-LEFT: rgb(153,153,153) 1px solid; WIDTH: 370px; COLOR: #000000; BORDER-BOTTOM: rgb(153,153,153) 1px solid; BACKGROUND-REPEAT: repeat; FONT-FAMILY: Arial,sans-serif; HEIGHT: 369px;WIDTH: 536px; 
}

 

    -
 字﹝大 小、顏 色、字 型﹞設 

li.post-text
{
FONT-SIZE: 16px;letter-spacing : 3pt;font-weight:bold;line-height : 200%;color : #00CC00;
}

 

      - 
 字﹝   ﹞設 

li.reply-text
{
FONT-SIZE: 16px;letter-spacing : 3pt;font-weight:bold;line-height : 200%;color : #6600FF;
}

 

{﹝備 註﹞}

    CSS  

           

   複製語法     CSS   

        Enter 空出位置

        {貼上語法}

 

 

 

 

引用**http://ab09301314.pixnet.net/blog/post/216852686

語蝶 發表在 痞客邦 留言(0) 人氣()

Xuite影音改版-最新音樂盒設定教學

 
 
 

 

如果網頁開太慢*按滑鼠右鍵* 點內容*

會開很快喔!

進入Xuite影音首頁http://vlog.xuite.net/,蒐尋所需的音樂。

1-2.在外連網址處按﹝自訂﹞選擇﹝舊版外連碼﹞。

3.按﹝複製﹞取得完整外連碼。

複製下來的完整外連碼

 

 

<object id='MzU4MDMxNg==' name='MzU4MDMxNg==' classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' width='180' height='60'><param name='allowScriptAccess' value='always'/><param name='allowFullScreen' value='true'/><param name='movie' value='http://vlog.xuite.net/_a/MzU4MDMxNg==&ar=1&as=1'/><param name='WMode' value='Transparent'/><embed type='application/x-shockwave-flash' src='http://vlog.xuite.net/_a/MzU4MDMxNg==&ar=1&as=1' width='180' height='60' allowScriptAccess='always' allowFullScreen='true' wmode='transparent'/></object>

 

4.截取紅色音樂 IP (英文字大寫部份)音樂 IP 共有4處都相同,任選其一即可。

5.將截取的音樂 IP 複製套入下面語法中,即是一個自動重複播放Xuite音樂盒。

 

 

<p align=center><embed allowScriptAccess="none"  src="http://vlog.xuite.net/vlog/swf/lite.swf?media=在此貼上音樂IP&amp;ar=1&amp;as=1" width="124" height="42" type="application/x-shockwave-flash"></embed></p>

 

以上為自動重複播放語法﹝將黑色 &amp;as=1 部分刪除即可手動播放﹞

 

 

歌名:

試聽:

自動重複播放語法【將紅色部分  &amp;as=1  刪除 即可手動播放】

水晶音樂_心湖

<p align=center><embed allowScriptAccess="none"  src="http://vlog.xuite.net/vlog/swf/lite.swf?media=MjMyODIxNA&amp;ar=1&as=1&amp;as=1" width="124" height="42" type="application/x-shockwave-flash"></embed></p>

 

 

 

在語法框裡面空白處用左鍵﹝快速按三下﹞,讓語法全部反黑,再按右鍵複製即可。

可依自己的欄位需求更改圖檔大小(數字增減) width="寬"  height="高"

width="寬" height="高" 數字全部改成 1 即可隱藏音樂盒。

 

語蝶 發表在 痞客邦 留言(2) 人氣()

«12