Basic HTML

-

Important Dates

---------------

Publication

------------

Article Template

Registration

Participation Only

Registration for Participation Only

Registration for Presenters

Registration for Presenters

---------------------
Home
College Department Conference
Call for Papers
Article Template Paper Submission
Registration Fee Account Details Registration Form
Committee Contact
-------------
1 / 3
2 / 3
3 / 3




Code for the above designs


<link href="https://www.w3schools.com/w3css/4/w3.css" rel="stylesheet" />
<div class="w3-container">
  <div class="w3-panel w3-pale-blue w3-leftbar w3-rightbar w3-border-blue">
    <p><span style="font-size: 16px;"><b>Important Dates</b></span></p>
  </div>
  <ul class="unstyled">
    <li><a href="#"><span style="font-size: 15px;">Last date for Registration<span style="color: red;">&nbsp;</span></span></a></li><li><span style="font-size: 14px;"><span style="color: red;">&nbsp;</span></span><span style="font-size: 14px;"><span style="color: red;"><strong>30 June 2024</strong></span></span></li><br />
    <li><a href="#"><span style="font-size: 15px;">Last date for Submission of Full Papers<span style="color: red;">&nbsp;</span></span></a></li><li><span style="font-size: 14px;"><span style="color: red;"><strong>15 June 2024</strong></span></span></li><br />
    <li><a href="#"><span style="font-size: 15px;">Intimation of Acceptance<span style="color: red;">&nbsp;</span></span></a></li><li><span style="font-size: 14px;"><span style="color: red;"><strong>30 June 2024</strong></span></span></li>
  </ul>
</div>&nbsp;<link href="https://www.w3schools.com/w3css/4/w3.css" rel="stylesheet" />
<div class="w3-container">
  <div class="w3-panel w3-pale-blue w3-leftbar w3-rightbar w3-border-blue">
    <p><span style="font-size: 16px;"><b>Publication</b>
</span></p>
  </div>
  <ul class="unstyled">
    <li><a href="#"><span style="font-size: 13.5px;"><span style=" color: A020F0;"><strong>Papers presented in the conference will be published in the Conference Proceedings with e-ISBN and DOI.</strong></span></span></a></li>
</ul></div><br />


---------------


<!doctype html>
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css" />
<div class="w3-container">
  <div class="w3-panel w3-pale-blue w3-leftbar w3-rightbar w3-border-blue">
    <p><span style="font-size: 14px;">Publication
</span></p>
  </div>
  <ul class="unstyled">
    <li><a href="#" ><span style="font-size: 12px;">Papers presented in the conference will be published in the Conference Proceedings with e-ISBN.</span></a></li>
</ul></div>



------------


<a href="Link" target="_blank" rel="noopener"><span style="color: red;"> <p><center> Article Template<p> <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSzQYwceob_rz7xNksfwpWPWU2aWDPxXi3Ykv_iu2wJEQ&s" width="100" height="100" alt="Registration" /> </p></center></p></span></a>

<a href="Link" target="_blank" rel="noopener"> <span style="color: red;"><p><center> Participation Only<p> <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSzQYwceob_rz7xNksfwpWPWU2aWDPxXi3Ykv_iu2wJEQ&s" width="100" height="100" alt="Registration for Participation Only" /> </p></center></p></span></a>


<a href="Link" target="_blank" rel="noopener"><span style="color: red;"> <p><center>Registration for Presenters<p> <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSzQYwceob_rz7xNksfwpWPWU2aWDPxXi3Ykv_iu2wJEQ&s" width="100" height="100" alt="Registration for Presenters" /> </p></center></p></span></a>



---------------------


<!doctype html>



<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
<style>
body {
  font-family: Arial, Helvetica, sans-serif;
}

.navbar {
  overflow: hidden;
  background-color: #333;
}

.navbar a {
  float: left;
  font-size: 16px;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.dropdown {
  float: left;
  overflow: hidden;
}

.dropdown .dropbtn {
  font-size: 16px;  
  border: none;
  outline: none;
  color: white;
  padding: 14px 16px;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}

.navbar a:hover, .dropdown:hover .dropbtn {
  background-color: #FFA500;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  float: none;
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdown-content a:hover {
  background-color: #ddd;
}

.dropdown:hover .dropdown-content {
  display: block;
}
</style>



<div class="navbar">
  <a href="#">Home</a>
  <div class="dropdown">
  <button class="dropbtn">About</button>
  <div class="dropdown-content">
  <a href="#">College</a>
  <a href="#">Department</a>
    <a href="#">Conference</a>
   </div>
</div>
    <a href="#">Call for Papers</a>
 
  <div class="dropdown">
  <button class="dropbtn">Submmission of Papers</button>
  <div class="dropdown-content">
  <a href="#">Article Template</a>
  <a href="#">Paper Submission</a>
       </div></div>

  
  
  <div class="dropdown">
  <button class="dropbtn">Registration</button>
  <div class="dropdown-content">
  
  <a href="#">Registration Fee</a>
  <a href="#">Account Details</a>
<a href="#">Registration Form</a>
       </div></div>

  <a href="#">Committee</a>
  <a href="#">Contact</a>
  
  
  
</div></!doctype>



-------------



<!doctype html>


<style>
* {box-sizing: border-box;}
body {font-family: Verdana, sans-serif; margin: 0;}

/* Center the slideshow */
.slideshow-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh; /* Adjust as needed */
}

/* Slideshow container */
.slideshow-container {
  max-width: 800px; /* Adjust as needed */
  position: relative;
  margin: auto;
  border: 2px solid #ccc; /* Outline box */
  padding: 9px;
}

* {box-sizing: border-box}
body {font-family: Verdana, sans-serif; margin:0}
.mySlides {display: none}
img {vertical-align: middle;}

/* Slideshow container */
.slideshow-container {
  max-width: 1000px;
  position: relative;
  margin: auto;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -22px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  animation-name: fade;
  animation-duration: 1.5s;
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .prev, .next,.text {font-size: 11px}
}

</style>



<div class="slideshow-wrapper">
  <div class="slideshow-container">

    <div class="slideshow-container">

<div class="mySlides fade">
  <div class="numbertext">1 / 3</div>
  <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSzQYwceob_rz7xNksfwpWPWU2aWDPxXi3Ykv_iu2wJEQ&s" style="height:420px" "width:200%" />
  <div class="text">                     </div>
</div>

<div class="mySlides fade">
  <div class="numbertext">2 / 3</div>
  <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSzQYwceob_rz7xNksfwpWPWU2aWDPxXi3Ykv_iu2wJEQ&s" style="height:420px" "width:200%" />
  <div class="text">                 </div>
</div>

<div class="mySlides fade">
  <div class="numbertext">3 / 3</div>
  <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSzQYwceob_rz7xNksfwpWPWU2aWDPxXi3Ykv_iu2wJEQ&s" style="height:420px" "width:200%" />
  <div class="text">                       </div>
</div>

<a class="prev" onclick="plusSlides(-1)">❮</a>
<a class="next" onclick="plusSlides(1)">❯</a>

</div>
<br />

<div style="text-align:center">
  <span class="dot" onclick="currentSlide(1)"></span> 
  <span class="dot" onclick="currentSlide(2)"></span> 
  <span class="dot" onclick="currentSlide(3)"></span> 
</div>


  </div>
</div>

<script>
let slideIndex = 1;
showSlides(slideIndex);

// Call the autoSlide function every 2 seconds
let slideInterval = setInterval(autoSlide, 4000);

function autoSlide() {
  plusSlides(1); // Move to the next slide
}

function plusSlides(n) {
  clearInterval(slideInterval); // Clear previous interval
  showSlides(slideIndex += n);
  slideInterval = setInterval(autoSlide, 4000); // Set new interval
}

function currentSlide(n) {
  clearInterval(slideInterval); // Clear previous interval
  showSlides(slideIndex = n);
  slideInterval = setInterval(autoSlide, 4000); // Set new interval
}

function showSlides(n) {
  let i;
  let slides = document.getElementsByClassName("mySlides");
  let dots = document.getElementsByClassName("dot");
  if (n > slides.length) {slideIndex = 1}    
  if (n < 1) {slideIndex = slides.length}
  for (i = 0; i < slides.length; i++) {
    slides[i].style.display = "none";  
  }
  for (i = 0; i < dots.length; i++) {
    dots[i].className = dots[i].className.replace(" active", "");
  }
  slides[slideIndex-1].style.display = "block";  
  dots[slideIndex-1].className += " active";
}
</script>


</!doctype>

Comments

Post a Comment

Popular posts from this blog

Install Dspace 7.2 on Ubuntu 22.04 LTS

-
Image
  Install Dspace 7.2 on Ubuntu 22.04 LTS Install Dspace 7.2 on Ubuntu 22.04 LTS Prerequisite software : i) Java JDK ii) Apache Maven iii) Apache Ant iv) Apache Tomcat v) PostgreSQL vi) Solr vii) Dspace 7.2 – backend viii) Dspace-angular 7.2 – frontend ix) Node.js x) Node Version Manager (NVM) xi) Yarn xii) gedit (text editor software) Note: It is highly recommended to install Dspace7 on fresh installed Linux-based operating system. It may not be compatible with the Virtual box platform. (Note the red mark lines are the commands that need to be executed on the terminal) Open the terminal by pressing (Ctrl+Alt+T) or go to Applications > Accessories > Terminal and select it for executing the below command. First update and upgrade your package system sudo apt update && sudo apt upgrade -y Install gedit for text editing sudo apt-get install gedit Create a Dspace user with password sudo useradd -m dspace sudo passwd d...
Read more

How to delete library data in koha using the command line

-
 How to delete library data in koha using the command line Sometimes you need to empty the all data (e.g. bibliographic, borrowers, and transaction details)  from your Koha LMS without losing the configuration settings and authorized values, e.g. libraries, item types, patron categories, locations, etc. Let us know how to delete data from the Koha instance/library. Delete Koha's bibliographic data NB: I would recommend taking a backup of the database before applying the following commands. Login as a root user sudo su Log into MySQL database mysql -uroot -p Enter MySQL root password use koha_library; Disable foreign key constraints when you truncate the tables SET FOREIGN_KEY_CHECKS=0; Delete all bibliographic details TRUNCATE items;  TRUNCATE biblioitems;  TRUNCATE biblio;  TRUNCATE deletedbiblioitems; TRUNCATE deletedbiblio;  TRUNCATE biblio_metadata; Delete all transactions  TRUNCATE old_issues;  TRUNCATE issues;  Delete borrowers details ...
Read more

Koha INSTALLATION

-
Image
   Koha INSTALLATION After installation of ubuntu 20.4 (Focal Fossa), right click on the mouse choose open terminal. past the following comments in terminal. Update Ubuntu using apt   sudo apt update sudo apt upgrade -y if the system asks for update make it "Remind me later" it may confuse the process Clear the apt-get packager manager cache sudo apt clean Install MariaDB-server dependence sudo apt install -y mariadb-server Provide MySQL/MariaDB root password (If the password asks during the installation process, enter the password in the window. Apply the following command, if the password window did not appear during the installation secure it) Securing MariaDB Run this command to improve the security of the MariaDB installation:   sudo mysql_secure_installation   (The script will prompt you to set up the root user password, remove the anonymous user, restrict root user access to the local machine and remove the test d...
Read more

Total views