blogger code程式代碼引用無法正常顯示

wdreamon

wdreamon
個人積分：0分
文章編號：37827774

0分

樓主

2012-08-16 22:56

是參考這裡的語法→http://synnwang.blogspot.tw/2006/11/blog.html

請問為什麼我的程式碼引用出來有些會不成功?

如圖
blogger code程式代碼引用無法正常顯示

附上原始語法︰

比較簡短的引用就可以成功引用
稍微長一點就會這樣分成好多格

請問這該怎麼解決呢?

2012-08-16 22:56 發佈

文章關鍵字 blogger code 程式代碼

gp1288

gp1288
個人積分：499分
文章編號：37829719

499分

2樓

2012-08-17 0:28

沒用過，單看程式覺得＜/code＞的位置怪怪的

ptx

ptx
個人積分：1221分
文章編號：37835216

1221分

3樓

2012-08-17 10:50

會不會跟你使用了"<"有關呢？
原文裡面不是說要用替代的字元嗎？

一個中文，各自表述

wdreamon

wdreamon
個人積分：0分
文章編號：37838356

0分

樓主

2012-08-17 13:06

ptx wrote:
會不會跟你使用了"<"有關呢？
原文裡面不是說要用替代的字元嗎？

hello
似乎是blogger先前改版後有些語法不合用
或是如果是"<"的問題
為什麼我的一些也有 "<" 的程式碼就可以成功，有些就又不行呢?

另外，我現在遇到另一個更很難解決的問題...
我換了另一種語法試試後
過長的程式碼引用後，會自動產生左右橫向的「捲軸」↓

我希望可以讓它自動斷行，不要產生捲軸
爬過一些文說應該是firefox的問題...

請問有人知道該如何解決嗎?

真是超級無敵困擾啊滾來滾去

wdreamon

wdreamon
個人積分：0分
文章編號：37839675

0分

樓主

2012-08-17 14:02

gp1288 wrote:
沒用過，單看程式覺得...(恕刪)

我知道他的問題了
應該是我當初在編輯頁面做了一些字體設定
它的行距中間多了＜div＞和＜/span＞等等的東西
所以才會包不完整

感謝你回覆!

waynefu

waynefu
個人積分：0分
文章編號：37849052

0分

6樓

2012-08-17 22:22

如果只是斷行的問題，在你原本的 code 區的 css 內加入以下即可：

word-wrap: break-word;

但是其他的問題比較大，如果你有空等(一兩天)，我可能發個專文來回答。

Blogger 中文社群：https://plus.google.com/communities/103807083735607134704

waynefu

waynefu
個人積分：0分
文章編號：37905920

0分

7樓

2012-08-20 22:30

從我的原文整理一下關於你本篇遇到的問題：

1. 程式碼區塊文字斷行問題：檢查 CSS 中是否有以下三項──

display: block; //以區塊呈現
overflow: auto; //固定區塊大小
word-wrap: break-word; //自動斷字

確定以上三項都有了之後，程式碼區塊內的英文長字串就能自動斷行。

2. Blogger 系統問題：經常於「HTML」模式與「撰寫」模式切換的話，就會發現Blogger經常自作聰明幫我們 "多空幾行"、或是自動轉換、增補程式碼。所以你遇到的狀況便是切換到「撰寫」模式時被Blogger變動過內容，導致程式碼區塊顯示出錯。

我的解決方法是，把 HTML 轉換為 Javascript，讓Blogger無法轉換 HTML，程式碼區塊就不會出錯了，而 HTML 轉換為 Javascript 的工具 google 一下就可以找到很多個，把轉換後的內容貼回文章就 ok 了。

更多其他相關心得，請參考我的原文「部落格文章標示特殊文字區塊的完整解決方案」。

Blogger 中文社群：https://plus.google.com/communities/103807083735607134704

wdreamon

wdreamon
個人積分：0分
文章編號：37975350

0分

樓主

2012-08-23 18:00

waynefu wrote:
從我的原文整理一下關...(恕刪)

原來如此!
感謝你提供的資訊
寫得很詳細，很容易理解!

我之前也覺得很困擾，不知道為什麼格式都會跑掉
常常要校正很多次，超級不方便的，原來是blogger自作聰明了!

另外，很奇怪的是我加入了word-wrap: break-word;，還是無法解決「左右捲軸」的問題
想說不能解決的話，就先將就了

下面是我程式碼的語法

display: block;
font-family: Courier New;
font-size: 10pt;
overflow:auto;
word-wrap: break-word;
background: #9bd19f url(https://sites.google.com/site/klcintwimages/Code_BG.gif) left top repeat-y;
border: 0px solid #ccc;
padding: 10px 10px 10px 21px;
max-height:1000px;
line-height: 1.2em;

waynefu

waynefu
個人積分：0分
文章編號：37986834

0分

9樓

2012-08-24 9:05

我用你的 css 設定測試了 CHROME、FireFox、IE 都沒問題，不會出現捲軸，所以無法知道你的問題出在哪，不知道你用的系統版本？瀏覽器版本？另外請再給我個測試網頁看看效果好了。

Blogger 中文社群：https://plus.google.com/communities/103807083735607134704

wdreamon

wdreamon
個人積分：0分
文章編號：38012456

0分

樓主

2012-08-25 10:25

waynefu wrote:
我用你的 css 設...(恕刪)

那真是太奇怪了

我的系統是XP SP2 瀏覽器是FF13.0.1

我有開一個用來測試的blogger

→http://testofyen.blogspot.tw/2012/08/02_24.html#more

用一樣的語法
我看到的仍是有捲軸