HTML / CSS / JavaScript

Ақпарат

Қызмет сипаттамасы:

Құны: 50.000 ₸

Орындалу күні: 2 күн

HTML, CSS және JavaScript – бұл веб-сайттарды жасау және әзірлеу үшін қолданылатын үш негізгі технология. Олар интерактивті және тартымды веб-беттерді жасау үшін бірге жұмыс істейді.

HTML (HyperText Markup Language) – веб-беттерді жасау үшін қолданылатын стандартты таңбалау тілі. Ол веб-беттің құрылымын және мәтін, кескіндер және сілтемелер сияқты мазмұнды анықтау үшін қолданылады.

CSS (Cascading Style Sheets) – HTML құжаттарының көрінісін сипаттау үшін қолданылатын стиль тілі. CSS HTML элементтерінің экранда, қағазда немесе басқа медиа орталарында қалай көрсетілетінін анықтайды.

JavaScript – веб-беттердегі интерактивті элементтерді жасауға мүмкіндік беретін бағдарламалау тілі. Ол динамикалық мазмұнды қосу, мультимедиялық элементтерді басқару, анимация және пайдаланушының веб-бетпен өзара әрекеттесуін жақсартатын басқа функциялар үшін қолданылады.

HTML, CSS және JavaScript пайдалану артықшылықтары:

HTML:

Оқуды және пайдалануды жеңілдетеді;
Браузерлердің кең қолдауы;
Көптеген құжаттама және әзірлеуші қауымдастықтар.

CSS:

Мазмұн мен көріністі бөлу;
Бір стильді көптеген элементтерге қолдану мүмкіндігі;
Адаптивті дизайнды қолдау.

JavaScript:

Динамикалық мазмұнды басқару;
Оқиғаларды өңдеу;
Дамуды жеңілдету үшін кең ауқымды кітапханалар мен фреймворктер.

Веб-әзірлеу үшін негізгі технологиялар:

HTML:
- Веб-беттің құрылымын жасау.
- Мәтін, кескіндер, сілтемелер және басқа элементтерді таңбалау үшін тегтерді пайдалану.
CSS:
- HTML элементтері үшін стильдерді анықтау.
- Түстермен, қаріптермен, макеттермен және анимациялармен жұмыс істеу.
JavaScript:
- Веб-бетке интерактивтілікті қосу.
- Мазмұнды динамикалық өзгерту үшін DOM (Document Object Model) жұмыс істеу.

HTML пайдалану мысалы:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sample Page</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <div id="content">
        <h1>Hello, World!</h1>
        <p>This is a sample page.</p>
        <button id="btn">Click Me!</button>
    </div>
    <script src="script.js"></script>
</body>
</html>

CSS пайдалану мысалы:

/* styles.css */
body {
    font-family: Arial, sans-serif;
    background-color: #f0f0f0;
    margin: 0;
    padding: 20px;
}

#content {
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    max-width: 600px;
    margin: auto;
    text-align: center;
}

h1 {
color: #333;
}

button {
    padding: 10px 20px;
    background-color: #007bff;
    color: #fff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

button:hover {
background-color: #0056b3;
}

JavaScript пайдалану мысалы:

// script.js

document.getElementById('btn').addEventListener('click', function() {

    alert('Button clicked!');

});