In this tutorial, we are going to change the background color of a webpage to the one supplied by the user in the input field.
Let’s get Started!
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>Change JavaScript Background Color on Click</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-0evHe/X+R7YkIZDRvuzKMRqM+OrBnVFBL6DOitfPri4tjfHxaWutUpFmBp4vmVor" crossorigin="anonymous">
<style>
.colorContainer {
display:flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
</style>
</head>
<body>
<div class="container d-flex justify-content-center colorContainer">
<form>
<input id="colorName" type="text" class="form-control-lg" placeholder="Enter color name or code" />
<button type="button" id="btn" class="btn btn-primary btn-lg" >Latest tech news and coding tips.
Every application that stores and manages data relies on a set of basic operations known…
PHP remains one of the most widely used server-side programming languages, powering platforms such as…
Danfo.js is an open-source JavaScript library designed for data manipulation, analysis, and machine learning. It provides…
JavaScript's async and await keywords revolutionized asynchronous programming by making asynchronous code look and behave more like synchronous code.…
Pretty Good Privacy (PGP) is one of the most widely used encryption systems for securing emails,…
Database migration is one of the most challenging tasks in software engineering. While both PostgreSQL…