Mozilla Thimble 在網頁上做網頁

做網頁的工具很多,舉凡以圖形介面為主的Dreamweaver或以文字編輯器為主的Brackets、Sublime Text…等等,但都必須要額外安裝才能使用,本篇文章介紹的Mozilla Thimble是一個線上編輯器,名符其實的是「在網頁上做網頁」、「網頁上的網頁編輯器」、「取之於網頁用之於網頁」,這樣的繞口令就別再說下去了,來看看他的介面吧!

進入官網之後,可以選擇點選「Start a project from scratch」來開始一個新的專案,或是透過下方已有的專案範本來編輯網頁。

Mozilla Thimble 網站截圖
Mozilla Thimble 網站截圖

而網頁編輯的介面如下,比較偏文字編輯器的介面。

Mozilla Thimble 編輯器介面
Mozilla Thimble 編輯器介面

當然在網頁編輯的部分就是利用大家所熟悉的HTML、CSS、javascript語法來進行,編輯器與Brackets的使用方式差不多(感覺有技術合作),例如:快速編輯是Ctrl+E;新增註解是Ctrl+/,基本的使用方式可以參考這篇文章,介面中的右側是Live Preview視窗,也可以直接切換成手機版面預覽,若是有需要在頁面中放入自己電腦裡面的檔案,可以利用左上角的「+」上傳,單檔容量限制為3MB。

比較特別的是若你有登入會員(免費),在網頁開發完成之後,可以透過右上角的Publish來公開自己的網頁,確定公開後會提供一個你專屬的網址,可以把網頁公開給大家瀏覽。

在Mozilla Thimble的網站上也有此款編輯器的教學:

不過大家要注意的是,目前此編輯器的網頁編輯功能僅有HTML、CSS、Javascript,不包含PHP、ASP…等動態網頁語法,希望未來真的可以進化到這種地步,那以後我們電腦裡面就不必安裝網頁設計軟體了!

You may also like...

25,984 Responses

  1. AlbertNer表示:

    http://semapharm24.com/# semaglutide tablets
    can i buy prednisone over the counter in usa

  2. Brianlit表示:

    п»їkamagra Kama Pharm Kamagra tablets

  3. LarryLog表示:

    Pred Pharm: PredPharm – can i buy prednisone from canada without a script

  4. 17 Signs You Are Working With Best Espresso Machine Quality Espresso Machine

  5. My partneг and I stumbled over hеre byy a dіfferent website and thought
    I shoukd check things out. I ⅼike ѡhat I see so i am just olⅼowing you.
    Look fоrward to looking at ʏour web ρage again.

    My ѡeb-site sex trẻ em f68

  6. Waltererync表示:

    Kama Pharm: buy Kamagra – Kama Pharm

  7. AlbertNer表示:

    http://dappharm.com/# cheap priligy
    buying prednisone

  8. DanielZek表示:

    http://predpharm.com/# PredPharm
    super kamagra

  9. AlbertNer表示:

    https://dappharm.com/# buy priligy
    prednisone 20mg tablets where to buy

  10. DanielZek表示:

    http://predpharm.com/# no prescription prednisone canadian pharmacy
    Kamagra tablets

  11. LarryLog表示:

    Kama Pharm: Kamagra 100mg – Kamagra 100mg

  12. Waltererync表示:

    semaglutide tablets: generic rybelsus tabs – semaglutide best price

  13. AlbertNer表示:

    http://dappharm.com/# dap pharm
    prednisone 30 mg coupon

  14. пропуск в москву для грузовых автомобилей пропуск в москву для грузовых автомобилей .

  15. LarryLog表示:

    cheap priligy: buy priligy – buy priligy

  16. AlbertNer表示:

    https://semapharm24.com/# rybelsus semaglutide tablets
    prednisone medicine

  17. Brianlit表示:

    dapoxetine online buy dapoxetine online cheap priligy

  18. 부산부달表示:

    15 Simple Measures On The Best Way To Give A Hot Stone
    Massage 부산부달

  19. AlbertNer表示:

    https://dappharm.com/# Priligy tablets
    buying prednisone on line

  20. Waltererync表示:

    prednisone tabs 20 mg: Pred Pharm – Pred Pharm

  21. DanielZek表示:

    https://dappharm.shop/# DapPharm
    Kamagra tablets

  22. Brianlit表示:

    Kama Pharm sildenafil oral jelly 100mg kamagra buy kamagra online usa

  23. DanielZek表示:

    http://predpharm.com/# prednisone purchase online
    sildenafil oral jelly 100mg kamagra

  24. Waltererync表示:

    Kama Pharm: Kama Pharm – Kama Pharm

  25. LarryLog表示:

    buy semaglutide: rybelsus semaglutide tablets – generic rybelsus tabs

  26. AlbertNer表示:

    https://dappharm.shop/# buy priligy
    prednisone 10mg canada

  27. I read this piece of writing fully about the resemblance of most recent and earlier technologies, it’s awesome article.

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。