Skip to main content

Posts

Difference between CSS and CSS3

Difference between CSS and CSS3 CSS works with HTML and provides a basic style and look to the website. CSS3 is the latest version of CSS. Some of the essential differences between CSS and CSS3 are: ✍️  Compatibility CSS -  The primary purpose of CSS was to focus on formatting features. They have capabilities for positioning texts and objects. CSS is backward compatible with CSS3. CSS3 -  When CSS3 code is written in CSS, it is invalid. CSS3 makes the Web Page more attractive. It takes less time to create a page. ✍️ Design CSS - It does not support responsive design. CSS3 - It is latest version and it supports responsive design. ✍️  Rounded corners and gradient CSS -  When CSS3 was launched, the developers designed some images that looked like the rounded corners with the  structures  and  backgrounds . Developers are designing a  border  and  uploading  the design to the server. CSS3 -  In CSS3 the developer writes the co...
Post a Comment
Read more
Recent posts

Print a webpage using javascript

Print a webpage using javascript Creating a simple Html button using as a print button whereby it prints current webpage. This action goes to javascript.  With this simple method, it is supported by all browsers including chrome, Firefox, explorer and opera. This method is called window print() method. Example Print the current page: window.print(); Definition and Usage The print() method prints the contents of the current window. The print() method opens the Print Dialog Box, which lets the user to select preferred printing options. With this, I'll demostrate to you an example as seen below. <button onlick="window.print();">Print</button> #js #printbutton #javascript #javascript_print_button
Post a Comment
Read more

The History of JavaScript

  The History of JavaScript JavaScript is everywhere, and for the seventh year in a row, it has been ranked  the most commonly used programming language , with 67.8% of developers employing it in 2019. Its ascent to the world’s most  popular programming language  is synonymous with the rise of the internet itself. Created out of necessity, it is used to build 95.2% (1.52 billion) of websites today, including some of the world’s largest, like Facebook and YouTube. Without it, we would not have popular and useful web apps such as Google Maps and eBay.  So, without further ado, let’s take a look at what JavaScript is,  how and why it was created, and what’s next for the language. What Is JavaScript? JavaScript is a scripting language that is one of the three core languages used to develop websites. Whereas HTML and CSS give a website structure and style, JavaScript lets you add functionality and behaviors to your website, allowing your website’s visitors ...
Post a Comment
Read more

Progress Bar with percentage

 <html>     <head>         <title>ProgressBar</title>     </head>     <style>     #bg{         position: absolute;         top:0; left:0;         width: 100%; height: 100%;         padding-top: 45%;     }     #pbg{         width:400px;         padding:5px;         border-radius:10px;         background-color: #fff;         border:solid 2px green;     }     #pb{         height:30px;         background-color: green;         text-align: center;         font-size: 18px;         font-weight: bold;         padding-top: 7px;         font-fam...
1 comment
Read more

Copy to clipboard using HTML, CSS and JavaScript

 <html> <head> <title>COPY TO CLIPBOARD</title> <style> table{   margin:0 auto;   width: 500px;   margin-top: 100px; } td{   padding-bottom: 50px; } .title{   font-weight: bold;   font-family: calibri;   font-size: 42px;   color: #fff;   text-shadow: 2px 2px 20px black; } .note{   font-size: 20px;   font-family: Arial; } #key{   width:330px;   padding: 5px;   border:solid 2px navy;   border-radius: 5px;   text-align: center;   font-family: Arial;   font-size: 24px;   background-color: #fff; } #txt{   width:480px; height:200px;   border: solid 2px navy;   border-radius: 5px;   padding: 10px;   text-align: center;   font-family: calibri;   font-size: 26px; } #btn, #gen{   font-family: calibri;   font-size: 18px;   font-weight: bold;   border:none;   color:#fff;   border-radius: 5px;   padding...
1 comment
Read more