DEV Community

BekmuhammadDev
BekmuhammadDev

Posted on

Javascript/Html/Css

Image description

JavaScript, HTML and CSS are the three main technologies for creating web pages. Each of them has its own unique features, and when used together, they are very effective in creating and managing web pages.

Image description

javascript,html,css structura:

Image description

HTML (HyperText Markup Language)
HTML is used to define the structure of web pages. It detects the components of web pages, such as text, images, videos, links, and other elements.

Basic Structure of HTML:

An HTML document consists of three main parts: the doctype declaration, the head part, and the body part.

The basic structure of HTML is:

<!DOCTYPE html>
<html>
<head>
  <title>Mening Veb Sahifam</title>
</head>
<body>

  <h1>Sarlavha</h1>
  <p>Bu paragraflar.</p>

</body>
</html>

Enter fullscreen mode Exit fullscreen mode

An HTML element is defined using tags. The tags consist of opening and closing tags, and the content between them makes up the content of the HTML element.

Basic HTML Tags

  • 'html': start and end of HTML document.
  • 'head': Contains metadata, styling and scripts.
  • 'title': Text to be displayed in the browser's title section.
  • 'body': Contains the main content of the web page.
  • 'h1' to 'h6': Labels for headings, 'h1' is the largest, 'h6' is the smallest heading.
  • 'p': Paragraph text.
  • 'a': Link (anchor) element.
  • 'img': Image element.
  • 'div': A section or container element.
  • 'span': Inline container element.

HTML is used to define the basic structure of web pages. It has a simple and understandable syntax, making it a very powerful tool when used in combination with other technologies. Using HTML, CSS, and JavaScript together, you can create interactive and aesthetically beautiful web pages.

CSS (Cascading Style Sheets)
CSS is used to specify the appearance, that is, the style of web pages. It controls the color, font, size, position and other visual properties of HTML elements.

css kod:

<!DOCTYPE html>
<html>
<head>
  <title>Mening Veb Sahifam</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      background-color: #f0f0f0;
      color: #333;
    }
    h1 {
      color: #0066cc;
    }
  </style>
</head>
<body>

  <h1>Sarlavha</h1>
  <p>Bu paragraflar.</p>

</body>
</html>

Enter fullscreen mode Exit fullscreen mode

css example:

h1 {
  color: blue;
  font-size: 24px;
}

Enter fullscreen mode Exit fullscreen mode

In the example above, the h1 selector sets the color and font-size properties for all

tags.

JavaScript
JavaScript adds dynamism to web pages. It manages user interaction, changes page content, validates data, and performs many other tasks.JavaScript is mainly used to make web pages dynamic and interactive. JavaScript was originally created by Netscape and is now one of the most popular and widely used programming languages ​​in the world.

javascript code:

<!DOCTYPE html>
<html>
<head>
  <title>Mening Veb Sahifam</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      background-color: #f0f0f0;
      color: #333;
    }
    h1 {
      color: #0066cc;
    }
  </style>
</head>
<body>

  <h1 id="sarlavha">Sarlavha</h1>
  <p id="matn">Bu paragraflar.</p>
  <button onclick="matnniOzgartirish()">Matnni O'zgartirish</button>

  <script>
    function matnniOzgartirish() {
      document.getElementById("sarlavha").innerHTML = "Yangi Sarlavha";
      document.getElementById("matn").innerHTML = "Matn o'zgartirildi!";
    }
  </script>

</body>
</html>

Enter fullscreen mode Exit fullscreen mode

Usage of JavaScript:

  1. Web Development: Mainly used in front-end development, but also used in back-end development thanks to Node.js.
  2. Mobile Apps: Used to create mobile apps through frameworks like React Native and Ionic.
  3. Games: Frameworks like Phaser and Babylon.js are used to create games that can be played in the browser.
  4. Server-side programming: Using Node.js, you can write programs that run on the server.

Popular frameworks and libraries:

  1. React: Developed by Facebook and widely used to create Single Page Applications (SPAs).
  2. Angular: Developed by Google and designed for building large and complex web applications.
  3. Vue.js: A framework with a very flexible and simple syntax, used in small and large projects.
  4. Node.js: Used for server-side programming, and helps create highly efficient and scalable web applications.

HTML defines the structure of the page, CSS decorates the page, and JavaScript adds dynamism to the page. Together, these three technologies are used to make web pages beautiful and interactive.

Image description

In the ranking of technologies in 2023, javascript is the leader, html, css is in 2nd place and other languages.

Image description

Top comments (0)