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...

24,092 Responses

  1. MichaelGeony表示:

    no prescription needed canadian pharmacy https://discountdrugmart.pro/# discount drug mart

  2. termburg.ru表示:

    Когда усталость берёт верх, так хочется расслабиться, зарядиться позитивом и подарить себе настоящий отдых. В Termburg.ru для этого созданы комфортная атмосфера: огромный водный комплекс с гидромассажем, горячие купели на свежем воздухе и специальные зоны отдыха. Для поклонников прогреть мышцы и почувствовать прилив сил работают [url=https://termburg.ru/]общественные бани в москве[/url] включая традиционную баню, сухую сауну и восточную парную. Здесь можно не просто переключиться, но и получить пользу для здоровья, очищая организм.

    Посетители ценят нас за гармонию и комфорт и разнообразие спа-процедур – [url=https://termburg.ru/price-abonements/]купить абонемент в термы[/url] предлагает профессиональные массажные программы, контрастные купели, аромапарение и уникальные программы восстановления для физического и эмоционального равновесия. Бронируйте визит в “Термбург” уже сегодня и откройте для себя место, где укрепление организма сочетается с удовольствием!

  3. Ищете, где провести качественное [url=https://xn--18-6kcdfki0a3cvc9f2b.xn--p1ai/protezirovanie/]имплантация передних зубов[/url] по современным стандартам? В нашей клинике работают опытные специалисты, применяющие современные методики и проверенные материалы. Мы предлагаем персонализированный подход, предлагая комплексный подход. Запишитесь на консультацию, чтобы позаботиться о зубах.

    Хотите сохранить зубам эстетику и комфорт? Мы предлагаем [url=https://xn--18-6kcdfki0a3cvc9f2b.xn--p1ai/implantation/]имплантация 2 зубов[/url] с использованием современного оборудования. Прочные конструкции, естественный вид и долговечность – вот что вы получите в нашей клинике. Посетите добрыеврачи18.рф и запишитесь на приём, чтобы обрести уверенность в себе!

  4. Charleskepsy表示:

    canadian pharmacy discount code http://easycanadianpharm.com/# canada drugs

  5. Watch Out: How Tiered Backlinks Service Is Taking Over And What You Can Do About It what are tier 2 Links [adorable-kangaroo-fd1Ttj.Mystrikingly.com]

  6. WillieRap表示:

    xxl mexican pharm: xxl mexican pharm – mexican online pharmacies prescription drugs

  7. Davidmoits表示:

    Cheapest online pharmacy: online pharmacy delivery usa – Online pharmacy USA

  8. Five Essential Qualities Customers Are Searching For In Every Renew Driver’s
    License trafikverket borås körkortföRnyelse

  9. 울산유흥表示:

    Networking Business Leads 울산유흥

  10. Charleskepsy表示:

    mail order pharmacy no prescription https://easycanadianpharm.com/# canadian pharmacy

  11. 10 Unexpected Cost Of Private Psychiatric Assessment Tips psychiatrist Mental health assessment

  12. WillieRap表示:

    xxl mexican pharm: xxl mexican pharm – buying prescription drugs in mexico online

  13. MichaelGeony表示:

    canadian pharmacy world coupon https://easycanadianpharm.com/# northwest canadian pharmacy

  14. Porterfax表示:

    pharmacies in canada that ship to the us easy canadian pharm easy canadian pharm

  15. MichaelGeony表示:

    canadian pharmacies not requiring prescription https://easycanadianpharm.com/# easy canadian pharm

  16. MichaelGeony表示:

    mail order pharmacy no prescription https://megaindiapharm.com/# MegaIndiaPharm

  17. Charleskepsy表示:

    cheapest pharmacy for prescriptions https://xxlmexicanpharm.com/# xxl mexican pharm

  18. MichaelGeony表示:

    offshore pharmacy no prescription https://megaindiapharm.shop/# Mega India Pharm

  19. Davidmoits表示:

    Mega India Pharm: india pharmacy mail order – Mega India Pharm

  20. MichaelGeony表示:

    online pharmacy no prescription needed https://megaindiapharm.com/# indian pharmacy online

  21. Charleskepsy表示:

    offshore pharmacy no prescription https://xxlmexicanpharm.com/# xxl mexican pharm

  22. Davidmoits表示:

    overseas pharmacy no prescription: Online pharmacy USA – Best online pharmacy

  23. Davidmoits表示:

    discount drugs: discount drugs – legit non prescription pharmacies

  24. Porterfax表示:

    MegaIndiaPharm Mega India Pharm buy prescription drugs from india

  25. Where Are You Going To Find Mental Health Assessment Test
    Be One Year From Today? Gas Assessment Mental Health

  26. Charleskepsy表示:

    canadian pharmacy coupon https://megaindiapharm.shop/# Mega India Pharm

  27. Indisputable Proof You Need Gas Cooker Engineer Near Me gas registered
    engineer near Me (http://www.Dermandar.com)

  28. WillieRap表示:

    medication from mexico pharmacy: xxl mexican pharm – xxl mexican pharm

發佈留言

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