• A
    
    <</span>
                                          <span class="correct-option check-span"><i class="fa fa-check-circle" aria-hidden="true"></i></span>
                                          <span class="wrong-option check-span"><i class="fa fa-times-circle" aria-hidden="true"></i></span>
                                        </li>                                                                         <li class="options-list-item" data-qid="4781">
                                          <span class="symbol">B</span>
                                          <span class="option-text"><pre class = "prettyprint"><xmp>
    <!</span>
                                          <span class="correct-option check-span"><i class="fa fa-check-circle" aria-hidden="true"></i></span>
                                          <span class="wrong-option check-span"><i class="fa fa-times-circle" aria-hidden="true"></i></span>
                                        </li>                                                                         <li class="options-list-item" data-qid="4781">
                                          <span class="symbol">C</span>
                                          <span class="option-text"><pre class = "prettyprint"><xmp>
    </</span>
                                           <span class="correct-option check-span"><i class="fa fa-check-circle" aria-hidden="true"></i></span>
                                          <span class="wrong-option check-span"><i class="fa fa-times-circle" aria-hidden="true"></i></span>
                                        </li>                                                                         <li class="options-list-item" data-qid="4781">
                                          <span class="symbol">D</span>
                                          <span class="option-text"><pre class = "prettyprint"><xmp>
    </</span>
                                           <span class="correct-option check-span"><i class="fa fa-check-circle" aria-hidden="true"></i></span>
                                          <span class="wrong-option check-span"><i class="fa fa-times-circle" aria-hidden="true"></i></span>
                                        </li> 
                                        <li class="options-list-item text-center"> <a target="_blank" href="https://api.whatsapp.com/send?text= Hi, Check this post: https://www.atnyla.com/gk/100/319/4781" > <i class="fa-regular fa-share-from-square"></i> Share this MCQ  </a> </li>
                                         
                                      </ul> 
                                    </div>
                                                                    <span style="display: none" id="correct-option4781">B</span>
                                    <div class="gk-answers" id="4781" style="display: none; ">
                                      <span style="padding-left: 0">Answer: </span>
                                      <span>B</span>
                                      <div class="gk-image">
                                        <br>
                                      </div>
                                      <p> 
    <p>Browsers will ignore comments in a code, and comments are used to add notes or explanations to the code for the benefit of the developer or other users who may be reading the code. <br>There are two types of comments in HTML: single line comments, which are denoted by the <!-- and --> characters, and multiple line comments, which are denoted by the /* and */ characters.<br> To add a comment in the code, you can place the text between these characters and it will not be visible in the user's browser. <br>Comments are a useful tool for organizing and documenting code, and they can help make it easier to understand and maintain.</p></p>
                                      
                                      
                                      <span style="padding: 10px 0">
                                        <a href="/general-knowledge/100/319">
                                          <i class="fa fa-share" aria-hidden="true"></i>
                                          Click me to Read more Question & Answer of 
                                          <img src="https://atnyla.com/assets/images/logo.png" class="rounded-circle" style="width:20px;height:20px; border: 1px solid #dfebe2;">
                                          <b> HTML Basic MCQ</b>
                                        </a>
                                      </span>
                                          
                                      <hr> <a target="_blank" href="https://api.whatsapp.com/send?text= Hi, Check this post: https://www.atnyla.com/gk/100/319/4781" class="text-center"> <i class="fa-brands fa-whatsapp"> </i> Share this MCQ </a>  
                                     
                                    </div>
                                    
                                                               <div class="container pb-5 text-center"> 
                                                                             <a href="/gk/100/319/4780" class="btn-sm btn btn-primary">
                                                &#8249; Previous
                                            </a>
                                          
                                            <a href="/gk/100/319/4782" class="btn-sm  btn btn-primary">
                                                Next &#8250;
                                            </a> 
                                   </div>
                           </div>
                             </div><br>
                              <div  class="row shadow p-3"  style="margin-bottom:10px;font-size:15px; border-radius: 20px; ">
                           <!-- Write your comment start section -->
                                <div id="accordion">
                                    <div class="card">
                                      <div class="card-header">
                                        <a class="card-link" data-toggle="collapse" href="#collapseOne">
                                          Write your comment
                                        </a>
                                      </div>
                                      <div id="collapseOne" class="collapse show" data-parent="#accordion">
                                        <div class="card-body"> 
                                            <form class="form" role="form" method="post" name='comment insert' accept-charset="UTF-8" id="comment-insert" enctype="multipart/form-data">
                                                 <div class="form-group">
                                                  <label for="comment"><b></b>Login and</b> Write a Comment:</label>
                                                  <textarea type="text" class="form-control bg-light" id="comment" placeholder="Enter comment" name="comment" required></textarea>
                                                </div> 
                                               	<input type="submit" name="ok_comment" class="btn btn-primary mt-3">
                                            </form>
                                        </div>
                                      </div>  
                                  </div>
                                </div>
                            </div> <br>
                            
                            <!--facebook comments start-->
                         <div id="fb-root"></div>
                        <script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v18.0&appId=846709638827925&autoLogAppEvents=1" nonce="sLyPNhZO"></script>
                         <div class="fb-comments" data-href="https://www.atnyla.com/gk/" data-width="" data-numposts="5"></div>
                          <!--facebook comments end-->
                          
                              <div  class="row shadow p-3" style="margin-bottom:5px;font-size:15px; border-radius: 20px; "> 
                               <p> Learn More MCQ Questions from <a href="/general-knowledge/100/319"> 
                                 <i class="fa-solid fa-share-from-square"> </i>  HTML <i class="fa fa-angle-double-right" aria-hidden="true"></i> HTML Basic MCQ                             </a></p> 
                                                                <p>Improve your HTML skills with our challenging HTML MCQ questions. Test your knowledge of HTML tags, attributes, and syntax with these interactive practice questions. Covering a wide range of topics, from basic HTML structure to advanced layout and styling techniques, our HTML MCQ questions are a great way to prepare for exams or simply improve your web development skills. With detailed explanations for each question, you can learn from your mistakes and track your progress as you go. Try our HTML MCQ questions today and see how much you know!</p>                               
                                   
                              </div>  
                          </div>
                       
                       
                       
                        
                       
                       </div>
                     <div class="col-lg-3">
                        
                        <br>
                      
                  </div>
                       
                   </div>
                   </div>
                         
                        <!-- Write your comment end section --> 
                                     </div>
               
             </div>
            </div>
        </div>
    </section>
    <button onclick="topFunction()" id="myBtn" title="Go to top">Top</button>
    <style>
             
     #myBtn {
      display: none; /* Hidden by default */
      position: fixed; /* Fixed/sticky position */
      bottom: 20px; /* Place the button at the bottom of the page */
      right: 30px; /* Place the button 30px from the right */
      z-index: 99; /* Make sure it does not overlap */
      border: none; /* Remove borders */
      outline: none; /* Remove outline */
      background-color: blue; /* Set a background color */
      background-color: transparent;
      box-shadow: 0 6px 6px rgba(0, 0, 0, 0.6);
      color: white; /* Text color */
      cursor: pointer; /* Add a mouse pointer on hover */
      padding: 15px; /* Some padding */
      border-radius: 10px; /* Rounded corners */
      font-size: 18px; /* Increase font size */
      border-radius: 50%;
    }
    
    #myBtn:hover {
      background-color: #00a7f5; /* Add a dark-grey background on hover */
    }
    </style>
         
    <script>
    // Get the button:
    let mybutton = document.getElementById("myBtn");
    
    // When the user scrolls down 20px from the top of the document, show the button
    window.onscroll = function() {scrollFunction()};
    
    function scrollFunction() {
      if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
        mybutton.style.display = "block";
      } else {
        mybutton.style.display = "none";
      }
    }
    
    // When the user clicks on the button, scroll to the top of the document
    function topFunction() {
      document.body.scrollTop = 0; // For Safari
      document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
    }
    </script> 
    
    <footer id="footer" style = "background: linear-gradient(to right, #1a2980, #26d0ce); margin-top: 10px;" class = "text-white p-3"> 
        <div class="footer-top">
          <div class="container-fluid">
            <div class="row"> 
              <div class="col-lg-2 col-md-6 footer-contact text-white"> 
              </div> 
              <div class="col-lg-3 col-md-6 footer-links text-white">
                <p style="font-size: 16px; color: white;">Useful Links</p>
                <ul>
                  <li><i class="bx bx-chevron-right"></i> <a href="https://www.atnyla.com/" class = "text-white">Home</a></li>
                  <li><i class="bx bx-chevron-right"></i> <a href="https://www.atnyla.com/about/" class = "text-white">About us</a></li> 
                  <li><i class="bx bx-chevron-right"></i> <a href="https://www.atnyla.com/terms-and-conditions/" class = "text-white">Terms of service</a></li>
                  <li><i class="bx bx-chevron-right"></i> <a href="https://www.atnyla.com/about/guest-post" class = "text-white">Guest Post</a></li> 
                  <li><i class="bx bx-chevron-right"></i> <a href="hhttps://www.atnyla.com/about/ads/" class = "text-white">Advertisement</a></li>
                </ul>
              </div> 
              <div class="col-lg-3 col-md-6 footer-links text-white">
                <p style="font-size: 16px; color: white;">Login</p>
                <ul>
                  <li><i class="bx bx-chevron-right"></i> <a href="https://www.atnyla.com/user/" class = "text-white">login</a></li>
                  <li><i class="bx bx-chevron-right"></i> <a href="https://www.atnyla.com/user/" class = "text-white">Sign Up</a></li> 
                </ul>
              </div> 
              <div class="col-lg-3 col-md-6 footer-newsletter">
                <p style="font-size: 16px; color: white;">Visit All Home</p>
                <ul>
                <li><i class="bx bx-chevron-right"></i> <a href="https://www.atnyla.com/syllabus/java-programming-language/0" class = "text-white">Syllabus</a></li>
                <li><i class="bx bx-chevron-right"></i> <a href="https://www.atnyla.com/library/java-programming-language" class = "text-white">Subject</a></li>
                <li><i class="bx bx-chevron-right"></i> <a href="https://www.atnyla.com/library/" class = "text-white">Library</a></li>
                <li><i class="bx bx-chevron-right"></i> <a href="https://www.atnyla.com/gk-and-current-affairs" class = "text-white">GK/MCQ</a></li>
                <li><i class="bx bx-chevron-right"></i> <a href="https://www.atnyla.com/blog/" class = "text-white">Blog</a></li>
                <!--<p>Tamen quem nulla quae legam multos aute sint culpa legam noster magna</p>-->
                <!--<form action="" method="post">-->
                <!--  <input type="email" name="email"><input type="submit" value="Subscribe">-->
                <!--</form>-->
               </ul>
              </div> 
               <!--<div class="col-lg-2 col-md-6 footer-newsletter">-->
                    <!-- <p style="font-size: 16px; color: white; ">Social Links</p>-->
                    <!-- <ul> -->
                    <!-- <li> <a href = "https://chat.whatsapp.com/BfdvA6k89H28bD4q4QqiaK" class="text-white">  Join Whatsapp Group  <i class="fa-brands fa-whatsapp"> </i> </a></li>-->
                    <!--<li> <a href = "https://t.me/ComputerLanguageWithRumman" class="text-white">  Join Telegram Group  <i class="fa-brands fa-telegram"></i> </i> </a></li>-->
                    <!--</ul>-->
                <!--</div>-->
            </div>
          </div>
        </div> 
        <div class="container d-md-flex   text-white"> 
          <div class="social-links text-center text-md-end pt-3 pt-md-0 text-white">
            <!--<a href="#" class="twitter"><i class="bx bxl-twitter"></i></a>-->
            <!--<a href="#" class="facebook"><i class="bx bxl-facebook"></i></a>-->
            <!--<a href="#" class="instagram"><i class="bx bxl-instagram"></i></a>-->
            <!--<a href="#" class="google-plus"><i class="bx bxl-skype"></i></a>-->
            <!--<a href="#" class="linkedin"><i class="bx bxl-linkedin"></i></a>-->
          </div>
        </div>
        
        <div class="me-md-auto text-center text-md-start">
            <div class="copyright text-center">
              © Copyright <strong><span>atnyla</span></strong>. All Rights Reserved
            </div>
            <div class="credits text-center"> 
              Designed by <a href="https://atnyla.com/"  style="color: white">atnyla.com</a>
            </div>
          </div> 
      </footer> 
        
    <!-- Scripts -->
    <!-- Bootstrap core JavaScript -->
    <script src="https://atnyla.com/vendor/jquery/jquery.min.js"></script>
    
    <script src="https://atnyla.com/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>  
    
    <script src="https://atnyla.com/assets/js/isotope.min.js"></script>  
    
    <!--<script src=" https://unpkg.com/isotope-layout@3.0.6/dist/isotope.pkgd.min.js"></script>  -->
    
    <script src="https://atnyla.com/assets/js/owl-carousel.js"></script>
    <!--<script src="https://atnyla.com/assets/js/lightbox.js"></script>-->
    <script src="https://atnyla.com/assets/js/tabs.js"></script>
    
    <!--<script src="https://atnyla.com/assets/js/video.js"></script>-->
    <!--<script src="https://atnyla.com/assets/js/slick-slider.js"></script>--> 
    
    <script src="https://atnyla.com/assets/js/custom.js"></script> 
    
    <!--<script src="https://cdn.jsdelivr.net/gh/google/code-prettify@master/loader/run_prettify.js"></script>-->
    <!--<script src="https://cdn.jsdelivr.net/gh/google/code-prettify@master/loader/run_prettify.js?skin=desert"></script>-->
    
    <script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script> 
    <script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script> 
       
     
    <script>
      //according to loftblog tut
      $(".nav li:first").addClass("active");
    
      var showSection = function showSection(section, isAnimate) {
        var direction = section.replace(/#/, ""),
          reqSection = $(".section").filter(
            '[data-section="' + direction + '"]'
          ),
          reqSectionPos = reqSection.offset().top - 0;
    
        if (isAnimate) {
          $("body, html").animate(
            {
              scrollTop: reqSectionPos,
            },
            800
          );
        } else {
          $("body, html").scrollTop(reqSectionPos);
        }
      };
    
      var checkSection = function checkSection() {
        $(".section").each(function () {
          var $this = $(this),
            topEdge = $this.offset().top - 80,
            bottomEdge = topEdge + $this.height(),
            wScroll = $(window).scrollTop();
          if (topEdge < wScroll && bottomEdge > wScroll) {
            var currentId = $this.data("section"),
              reqLink = $("a").filter("[href*=\\#" + currentId + "]");
            reqLink
              .closest("li")
              .addClass("active")
              .siblings()
              .removeClass("active");
          }
        });
      };
    
      $(".main-menu, .responsive-menu, .scroll-to-section").on(
        "click",
        "a",
        function (e) {
          e.preventDefault();
          showSection($(this).attr("href"), true);
        }
      );
    
      $(window).scroll(function () {
        checkSection();
      });
    </script>
    <script>
      $(document).ready(function () {
        $("#side-bar-toogle-btn").click(function () {
          $("#sidebar-list-group").toggle("slow");
        });
      });
    </script> 
        
    <script async src="https://fundingchoicesmessages.google.com/i/pub-7357847575760859?ers=1" nonce="P8qLHGFgH5IxNN3G6pLnUA"></script><script nonce="P8qLHGFgH5IxNN3G6pLnUA">(function() {function signalGooglefcPresent() {if (!window.frames['googlefcPresent']) {if (document.body) {const iframe = document.createElement('iframe'); iframe.style = 'width: 0; height: 0; border: none; z-index: -1000; left: -1000px; top: -1000px;'; iframe.style.display = 'none'; iframe.name = 'googlefcPresent'; document.body.appendChild(iframe);} else {setTimeout(signalGooglefcPresent, 0);}}}signalGooglefcPresent();})();</script>
    
    
    <script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js"></script>
    <script>
    // prettyPrint();
    </script>
      
    </body>
    </html>
    <!-- The Modal -->
    <div class="modal" id="ReportQuestionModal">
        <div class="modal-dialog modal-lg">
          <div class="modal-content">
          
            <!-- Modal Header -->
            <div class="modal-header">
              <h4 class="modal-title">Report Question</h4>
              <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>
            
            <!-- Modal body -->
             
            <div class="modal-body">
            <div id="messageDiv" class="alert alert-success" style = "display:none"> </div>
                 <form method="POST" id = "myFormReport" class="needs-validation" novalidate>
                  <div class="form-group">
                      <p>Hello, please login before you report any Quesion. &nbsp; <button type="button" class="btn btn-success btn-sm" data-toggle="modal" data-target="#myModalLogin" id = "loginButton"> Login </button> </p><br>                  
                     
                   
                  <div class="form-group">
                    <!--<label for="question">Write the issue/problem:</label>-->
                    <textarea class="form-control" id="issueInQuestion" name="issueInQuestion" rows="5" required></textarea>
                    <div class="invalid-feedback">
                      Please enter your question.
                    </div>
                  </div> 
                  <button type="submit" id="submitBtn" class="btn btn-primary mt-2">Submit</button>
               </div>
                </form>
            
            
            <!-- Modal footer -->
            <div class="modal-footer">
              <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
            </div>
            </div> 
        </div>
     </div>
    </div>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
    <script>
    $(document).ready(function () {
      
    $(".options-list-item").click(function () {
      var qid = $(this).attr("data-qid");
      var selected_option = $(this).children("span:eq(0)").text();
      var correct_option = $("#correct-option" + qid).text();
        //  alert(correct_option);
      if (selected_option == correct_option) {
        $(this)
          .children(".correct-option")
          .css({
            color: "#05e841",
          })
          .show();
        $("#" + qid).show("slow");
        $("html, body").animate(
          {
            scrollTop: $("#" + qid).offset().top - 80,
          },
          1500
        );
        // $("#" + qid).focus();
      } else {
        $(this).children(".wrong-option").css("color", "red").show();
      }
    });
    
    
    
    
     $(document).ready(function() {
       
     
    $('#loginButton').on('click', function() {
        
      // Hide the ReportQuestionModal modal
      $('#ReportQuestionModal').modal('hide'); 
      $(".modal-backdrop").remove();
    
      // Show the myModalLogin modal
      $('#myModalLogin').modal('show');
      
    });
         
      $('#submitBtn').click(function(e) {
        e.preventDefault();
        var userName = " ";
        var user_id_session = ""; 
        // alert(user_id_session);
        if(user_id_session == null || user_id_session == ""){
              // alert("Please Login");
              $("#ReportQuestionModal").modal("hide");
              $(".modal-backdrop").remove();
              $("#myModalLogin").modal('show'); 
                
        }else{
            var formData = $('#myFormReport').serialize() + '&functionID=report_question';
            var  question_id = 4781;
            formData = formData+"&question_id="+question_id;
            $.ajax({
              url: 'https://www.atnyla.com/dashboard-rumman/ajax/userGK.php',
              type: 'POST',
              data: formData,
              success: function(response) {
                var response = JSON.parse(response);
                 if(response.status === 'success') {
                     // alert(response.message+"Your Report ID: "+response.issue_id);
                     text = response.message+"  Your Report ID: "+response.issue_id;
                     $("#messageDiv").text(text);
                     $("#messageDiv").show();
                     $("#myFormReport").hide();
                    }
                  if(response.status === 'failed') {
                       
                 }
              },
              error: function() {
                alert('Error submitting form. Please try again later.');
              }
            }); 
        }
        
       
      });
    });
    
      
       
      
      
    
    });
    </script>
    <style>
     
    @keyframes blink {
      0% { opacity: 1; }
      50% { opacity: 0; }
      100% { opacity: 1; }
    }
    
    .fa-circle-question {
      animation: blink 1.5s infinite;
      color:yellow;
    }
     
    .comment{
        margin-top: 5%;
        margin-left: 20px;
    }
    
    
    .comment{
        border: 1px solid rgba(16, 46, 46, 1);
        background-color: rgba(16, 46, 46, 0.973);
        float: left;
        border-radius: 5px;
        padding-left: 40px;
        padding-right: 30px;
        padding-top: 10px;
        
    }
    .comment h4,.comment span,.darker h4,.darker span{
        display: inline;
    }
    
    .comment p,.comment span,.darker p,.darker span{
        color: rgb(184, 183, 183);
    }
    
     </style>