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,899 Responses

  1. LarryLog表示:

    semaglutide tablets for weight loss: buy semaglutide – generic rybelsus tabs

  2. AlbertNer表示:

    https://predpharm.com/# prednisone 20mg buy online
    prednisone over the counter south africa

  3. DanielZek表示:

    https://kamapharm.com/# super kamagra
    Kamagra tablets

  4. AlbertNer表示:

    https://semapharm24.com/# Sema Pharm 24
    prednisone 40 mg price

  5. LarryLog表示:

    prednisone: PredPharm – prednisone 30 mg tablet

  6. Waltererync表示:

    Kama Pharm: Kama Pharm – Kama Pharm

  7. Doramahit.tv表示:

    Зачем платить, если можно смотреть бесплатно? Этот сайт создан для настоящих ценителей жанра, которые хотят получать лучшие сериалы без ограничений. Здесь доступны [url=https://doramahit.tv/]дорамы бесплатно[/url], причем в хорошем качестве, с возможностью выбора перевода и удобным плеером.

  8. Brianlit表示:

    cheap priligy buy dapoxetine online dapoxetine price

  9. Waltererync表示:

    rybelsus semaglutide tablets: cheap semaglutide pills – cheap semaglutide pills

  10. AlbertNer表示:

    https://predpharm.com/# buy prednisone without prescription
    buy prednisone online canada

  11. LarryLog表示:

    prednisone otc price: prednisone 20mg by mail order – Pred Pharm

  12. AlbertNer表示:

    https://predpharm.shop/# where to buy prednisone in canada
    prednisone 5 mg tablet

  13. I was wondering if you ever considered changing the structure of your site?
    Its very well written; I love what youve got to say. But maybe you
    could a little more in the way of content so people could connect
    with it better. Youve got an awful lot of text for only having one or 2
    images. Maybe you could space it out better?

  14. LarryLog表示:

    Priligy tablets: DapPharm – dapoxetine online

  15. AlbertNer表示:

    https://semapharm24.com/# semaglutide best price
    15 mg prednisone daily

  16. DanielZek表示:

    http://semapharm24.com/# Sema Pharm 24
    super kamagra

  17. The Next Big Event In The Mobility Scooter Usa Industry versatile mobility scooters

  18. AlbertNer表示:

    https://kamapharm.shop/# Kama Pharm
    can i buy prednisone from canada without a script

  19. installed表示:

    Where Are You Going To Find Double Glazing Fitters Near Me Be 1
    Year From Today? installed

  20. Waltererync表示:

    Cyt Pharm: Cyt Pharm – buy cytotec online fast delivery

  21. DanielZek表示:

    http://cytpharm.com/# buy cytotec pills online cheap
    Kamagra 100mg price

  22. AlbertNer表示:

    https://cytpharm.shop/# buy cytotec
    where can you buy prednisone

發佈留言

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