HTML Online

לכתוב, להריץ ולשתף קטעי קוד - בלי שום התקנה.

תצוגה מקדימהתצוגה מקדימה אוטומטית

קונסול

פלט הקונסול יופיע כאן.

<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>Gradient Preview</title>
        <style>
            body { margin: 0; min-height: 100vh; display: grid; place-items: center;
                font-family: system-ui, sans-serif; }
            .card {
                width: 280px;
                height: 280px;
                border-radius: 24px;
                background: linear-gradient(135deg, #6c8cff 0%, #b18cff 60%, #ff8ab0 100%);
                box-shadow: 0 20px 40px rgba(108, 140, 255, 0.35);
                display: grid; place-items: center;
                color: white; font-size: 18px; font-weight: 600;
            }
        </style>
    </head>
    <body><div class="card">Linear gradient</div></body>
</html>

בנו HTML, CSS ו-JavaScript עם תצוגה מקדימה חיה

עורך HTML, CSS ו-JavaScript אונליין וחינמי עם תצוגה מקדימה אמיתית בדפדפן. ערכו שלושה קבצים, index.html, styles.css ו-script.js, וה-iframe מתרנדר מחדש בכל שינוי. בלי שרת מקומי, בלי התוסף Live Server ובלי שלב build.

העורך בנוי על אותו מנוע של VS Code, כך שהשלמה אוטומטית של תגיות HTML, מאפייני CSS ו-JS עובדת. התצוגה המקדימה החיה מציגה את הדף שלכם בתוך iframe מבודד בדפדפן. מתאים לסקיצה של דף נחיתה, לניסויים עם CSS grid או לכתיבת סקריפטים של DOM ב-JavaScript נקי.

מה הופך את עורך ה-HTML, CSS ו-JavaScript האונליין הזה לשימושי

תצוגה מקדימה חיה ומיידית: ערכו HTML, CSS או JS וה-iframe מתרנדר מחדש בכל שינוי. בלי שלב build ובלי רענון.
הדגשת תחביר והשלמה אוטומטית ל-HTML, CSS ו-JavaScript. קיצורים בסגנון Emmet ומשוב מיידי, הכול באותו מנוע עורך של VS Code.
אפס התקנה: בלי Node, בלי Live Server ובלי שרת HTTP מקומי. הציגו HTML, CSS ו-JS מכל דפדפן.
תצוגה מקדימה חיה עם שלושת הקבצים: HTML, CSS ו-JavaScript נערכים יחד ומתרנדרים מחדש ב-iframe בכל שינוי, בלי שלב build.

מה אפשר לבנות בעורך ה-HTML, CSS ו-JavaScript האונליין

דף נחיתה: HTML מובנה, CSS מודרני (grid, flex, custom properties) וקצת JavaScript, הכול נטען מחדש בזמן אמת ב-iframe של התצוגה המקדימה.
ניסויי CSS: פריסות grid, יישור עם flex, אנימציות ו-media queries רספונסיביות, עם משוב חזותי מיידי בכל שינוי.
סקריפטים של DOM ב-JavaScript נקי: querySelector, event listeners, קריאות fetch ו-localStorage, עם תצוגה מקדימה חיה בדפדפן למשוב מיידי.

שאלות נפוצות על עורך HTML, CSS ו-JavaScript אונליין

עורך ה-HTML, CSS ו-JavaScript האונליין חינמי?

כן, עורך ה-HTML, CSS ו-JavaScript חינמי לשימוש. בלי הרשמה, בלי שרת מקומי ובלי התוסף Live Server של VS Code: פשוט כותבים ורואים את התוצאה.

צריך שרת מקומי או את Live Server של VS Code?

לא צריך להתקין כלום. לא צריך את Live Server של VS Code, שרת HTTP מקומי או Node. הדפדפן מציג את קובצי ה-HTML, CSS ו-JS שלכם ישירות בתוך iframe.

עורך ה-HTML, CSS ו-JavaScript האונליין עובד בנייד?

כן. עורך ה-HTML, CSS ו-JavaScript עובד בדפדפנים במחשב, בטאבלט ובנייד. העורך, ה-iframe של התצוגה המקדימה ולשוניות הקבצים מתאימים את עצמם למסכים קטנים.

בטוח להציג כאן HTML ו-JavaScript?

כן. ה-HTML, ה-CSS וה-JavaScript שלכם מוצגים בתוך iframe מבודד של תצוגה מקדימה בדפדפן, בנפרד מדף Coddy שמסביב.

איך ממשיכים ללמוד HTML, CSS ו-JavaScript אחרי שמנסים את העורך?

שנו את קוד ה-HTML, CSS ו-JS לדוגמה, לחצו על הרצה וצפו בתצוגה המקדימה מתעדכנת. כשתרצו משהו מובנה יותר, הקורסים האינטראקטיביים של Coddy ב-HTML, CSS ו-JavaScript לוקחים אתכם מ-selectors ועד דפים שלמים.

כלים שימושיים ל-Web

כלים חינמיים בדפדפן שמשתלבים היטב עם עורך ה-Web אונליין - כולם חלק מ-Coddy.

לכל הכלים למפתחים דף עזר Web השוואת פלטפורמות לימוד תכנות