homepage.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="home-page.css">
    <title>HOME-PAGE</title>
</head>
<body>
    <div id="sorting">
        <h1>sorting</h1>
    </div>
    <div id="question">
        <h6>
            what is sorting ?
        </h6>
    </div>
    <div id="answer">
        <p>Sorting is a fundamental operation in computer science and data processing that involves arranging elements in a specific order. <br>
             Typically,the elements being sorted are stored in an array, list, or other data structure. <br>
              The goal of sorting is to make it easier to search for specific elements,
              access data in a specific order, or optimize algorithms that rely on data being in a certain sequence.
        </p>
      <h6>The most common orders for sorting are:</h6>
        <p>1. Ascending Order: Arranging elements from the smallest to the largest. <br>
           2. Descending Order: Arranging elements from the largest to the smallest.
        </p>
        <h6> Sorting Algorithms:</h6>
        <p>
            There are various sorting algorithms designed to achieve this task, <br> each with its own set of characteristics, advantages, and disadvantages. <br> Some of the most well-known sorting algorithms include:
        </p>
       
    </div>
    <div id="typesOfSorting">
        <p>1. bubblesort</p>
        <p>2. Selection Sort</p>
        <p>3. Merge Sort </p>
        <p>4. Quick Sort </p>
        <p>5. Heap Sort</p>
    </div>

<section>
    <div>
        <h6>Vizulization of algorithms:</h6>
        <div class="boxes">
            <div id="box">
                <img class="bubble" src="bubble.png" alt="">
                <p> <a href="bubbleSort.html"> Bubble Sort</a></p>
            </div>
            <div id="box2">
                <img class="bubble" src="choice.png" alt="">
                <p> <a href="selection.html">Selection Sort</a></p>
            </div>
            <div id="box">
                 <img class="bubble" src="plus.png" alt="">
                 <p>more sort +</p>
            </div>
        </div>
    </div>
 </section>
 <div id="sorting">
    <h1>Thank you</h1>
</div>
</body>
</html>