Loading...

圖文穿插效果

Temperature: 0 °C

ChungChung
author_tools

寫故事還是得圖文穿插看起來方便些~

其實一直都在找最適合寫故事的方式,一開始把所有上傳照片都放在故事開頭...看起來版面是很乾淨...

但的確也不是那麼容易閱讀...尤其是在手機的畫面上看..可以感覺到更不方便...

知道痞客邦是用html編輯器的方式讓使用者寫作...這會有點像word的方式排版...

但總覺得好像也沒有要那麼多功能...

最後還是先用了這樣的排版方式:

圖文穿插效果
上傳圖片的同時...系統也會將上傳的圖檔標籤寫入故事內文...

之後當把故事儲存後...前台便會顯示如下列畫面

圖文穿插效果
嗯,這樣就可以達到圖文穿插的結果....想以後寫故事或技術文應該方便多了吧....

至少在手機上看起來還不錯...

台北市松山區八德路四段650號 Go

https://innstory.com/story-圖文穿插效果-389
Innstory

Prev
 早上好Goat_Coffee_山羊咖啡

Next
來一盤駱式海鮮義大利麵 

Nearby Attractions

台北市松山區八德路四段650號-Nearby Attractions

  • 王寵惠墓園 Go
  • 紫藤廬 Go
  • 臺灣總督府博物館 Go
  • 曹洞宗大本山臺灣別院鐘樓 Go
  • 士林慈諴宮 Go
  • 國立臺灣大學日式宿舍-戴炎輝... Go

About the Author

Chung

我是chung
網路工作者
主業是網站系統開發建置
副業是做夢,寫故事
作品請參考/teme.biz
做夢請參考/innstory.com
聯絡/chung.teme@gmail.com

#有人用筆寫日記,有人用歲月寫日記,有人用照片寫日記,而我,用innstory寫日記。

Visitor message

Leave some footprints to prove that you visited me

  • eyJpdiI6IlptUmhhMmx1Wld3N2FXNXFZV3BrYWc9PSIsInZhbHVlIjoiQ1d1akZrMTBzb2xuK25vT09wd1lqZz09In0

    Chung 2015-12-20 03:54:00 0

    目前故事內容上傳照片只適用單選而不是複選,但可重上傳多次並無限制,上傳照片原本有設定單張照片上限是以次超過2MB為主,目前有先把上傳限制調整至5MB...可再試看看,謝謝。
  • eyJpdiI6IlptUmhhMmx1Wld3N2FXNXFZV3BrYWc9PSIsInZhbHVlIjoiV0UrNmNxTXNrTmFNSFhxUzU0WGxRQT09In0

    季念 2015-12-20 02:22:46 0

    今天想來寫一篇回顧這一年的文章,需要放很多張照片,然而卻發現照片只能放一張。 有些是檔案太大,我調過之後又再試了一次,雖然他沒有再跑出檔案太大的提示,可是它上傳到一半,就不見了,試了很多次都是這樣子,請問怎麼辦?

Recommended reading

Author's other related stories

SQL Injection

SQL Injection

SELECT * FROM users WHERE user=&#;aidan&#;...

如何用javascript接收radio button被選取後的值

如何用javascript接...

剛剛竟然犯了最簡單的錯誤~ 而且還是在趕著時間的時候⊙⊙ 我竟然蠢到用接收input 的方式去接收 ...

找對方法,開創自己的網路流量

找對方法,開創自己的網路流量...

前些天,Tim傳來了一個消息...http://classt...

Recommended reading

Other stories happened at this address

HTML5 影音手持裝置適應不良篇

HTML5 影音手持裝置適應...

這天下午跟客戶開完會... 客戶針對專案中手持裝置網站適應性做了需調整的說明..另外還包括影音檔播放...

Mandy說我想要募款去紐西蘭@@

Mandy說我想要募款去紐西...

bg (示意圖,不確定是不是南湖大山..是在寫太魯閣系統時使用的素材) 南湖大山位於台灣的中央山脈主...

定義404頁面

定義404頁面

什麼是頁面? HTTP 或Not Found錯誤訊息是HTTP的其中一種「標準回應訊息」(HTTP狀...

圖型插件Elastislide

圖型插件Elastislid...

teach Elastislide是一款好用的圖形插件......

Responsive Web Design使用CSS3的Media Queries進行自適應網頁設計

Responsive Web...

智慧型手持裝置(手機、平板)已是非常普及的日常生活必需品。 所以現在,在開發系統時客戶都會詢問是否支...

判斷捲軸的位置

判斷捲軸的位置

當捲軸往下移動時,判段目前移動到哪個位置... Javascript部份 $(function(){...

Please select an option

error

Hi, thank you for your participation, but you cannot vote repeatedly~

Join innstory now and start recording your story.

"Innstory" is a place to store stories. We are committed to becoming a warm platform. Deepening the bonds between people is our direction.
We are convinced that the blockchain between people is not just a cold calculation. Join us now.

Wrong format