Featured
-
Creating Horizontal Menu Bar Using Html and CSS
Hello readers, If you want to create a horizonta
by nitish.rawat -
Custom checkbox using jquery
Hello Reader ! Here is an example how to make
by mukul.kant -
How to make Sticky navigation
Hello Readers ! Below is an example of sticky n
by mukul.kant -
Smoke Font Animation
Hello Friends, The following codes below is an an
by kushal.kant -
How to Make A Simple DropDown in HTML With The Help of Jquery and CSS
You Can Use Below Code to Make A Simple Drop D
by indresh.kumar
Tags
How to Use Parameters in HTML5 Video Tags/Attributes
One Of the Most powerful elements of HTML5 is Video. The video element is used to embed the video in the HTML page.
There is no need of any plugin or other markup, and the best thing is that it supports all the major browsers. You have to just...
Top 8 Major Changes in Latest Bootstrap 4 Alpha Version for Web Designers
Hello Readers! Currently alpha version of Bootstrap 4 has been released on 19 August 2015 with some major changes. Moving from bootstrap 3 to bootstrap 4 , some components are changed and some are improved and only few have been dropped.
...
The Viewport - Responsive Web Design
Viewport meta tag is the primary idea of Responsive Web Design. The viewport differs from device to device. It will be smaller on a mobile when contrasted with PC screen.
To set the viewport, HTML5 presented a technique <meta> tag,...
What is SVG and How Can We Embedding SVG in Html5?
Scalable Vector Graphics is mostly known as SVG is an image format type which is based on XML it is basically used for 2-dimensional graphics for a web. We can resize SVG vector images to any extent without destroying the image qualit...
Bootstrap Grid System
Bootstrap grid system are used for creating page layout using series of rows and columns.
It allow maximum 12 columns across the page.
First class we use in grid system is .container. All rows and columns are placed inside container. Conta...
How to Customize Checkbox With the Help of CSS?
s we know checkboxes look and feel is dependent on the operating system in which we are seeing them .For windows operating system they look different and for mac operating system they look different. It is very difficult to change the look of the...
An Overview on SVG Images
Hello readers, Today in my blog I will discuss Scaleable Vector Graphics Images.
Introduction:-
It is an XML-based vector images created for 2D graphics.
Using the Vector Graphics we can create geometric objects such as lines...
Hop Over Notification Badge
Hello Readers!
We web designer can give new look and feel to any content of the div, We have numerous style, effects and animation including keframes which will result to get a graceful ambience to the content, Here in this blog i used same effe...
Dropdown with Multiple checkbox select with jQuery
jQuery multiselect list with checkbox is used for making selection among the choices that user want to select. There are various pulgin used for converting simple dropdown list to multiple select dropdown with checkbox. It cant includes checkbox ...
An Overview to Map Tag in Html
Hello readers, Today in my blog I will discuss about Map tag which is less used but have various features.
As there are around 142 HTML elements that has been standardized by W3C. Below is the brief description about Map Tag in HTML ...
Difference b/w Div and Span Tags
Hello readers, Toady in my blog I will discuss upon the difference b/w Div and Span tag in HTML.
For every beginner it is very confusing where to use which tag either Div or Span.
The <span> and <div> tags ar...
Dropdown Menu using PureCSS
Dropdown Menu is used where user has to show list of items for example in selecting countries and state name or finding this list of any latest technology , movies or it should be anything that gives us option to do a choice. This dropdown menu a...
Creating Credit Card Form Using Bootstrap
Hello readers, Today in my blog I have tried to create credit card form using Bootstrap.
In the HTML, I need to create an outer div with the class name as credit card div and had 2 nested div inside it.
With the help of ...
Difference b/w Dreamweaver & Adobe Muse
Hello readers, Today in my blog I would like to discuss the difference b/w Dreamweaver and Adobe Muse.
Who should use which software b/w among the both ?
-: Dreamweaver this software is used by the web designers that loves to...
An Overview on Adobe Muse
Hello readers, today in my blog I will discuss about a software i.e Adobe muse that is used to built website in which the user does not need to write any code.
So, here is a good news for all web designers that literally hate coding ...
Tips To Increase The Website Speed
Hello readers, Today in my blog I will discuss some tips that would help the web designer to improve their website speed.
As many of us have visited various Online Shopping website and many of them take much time to load which losses...
What is the difference between HTML and XHTML?
1. HTML documents are made of elements that have three different components- element tags , start tag end tag; element attributes are given within tags. HTML element lies between and including tags.
XHTML documents has only one root element. A...
CSS3 Hover effect
CSS3 Hover effect makes possible several changes to the single elements by adding many features to it, for example It includes feature like transition, transform and animation. That will add new effect to the simple div. The :hover selector is us...
Jquery .map() method
Jquery .map( callback ) method is used to project the contents that is used in the array and then map this object with the new set of array, It is able to create a new array for calling every elements. It provides function once for each set of an...
Adding Effects using queue() Method
Queue() method is used in jQuery to returns a number of animations to be performed on the elements in the jQuery object. This method is used for the continuous looping of a jquery element. It returns the effect which is used in the queue. While q...
An Overview to HTML KickStart Framework
Hello readers, Today In my blog I will discuss about a recent framework i.e HTML KickStart Framework.
It is useful for resolving the issues that have aroused in various frameworks and have tried to resolve them.
In...
Jquery Filtering Methods
The jquery filtering methods is used for the purpose for specifying the criteria, Those elements didn't matched with the criteria it will illuminate from the selection while the matched elements will be returned.
It has multiple methods like...
How to install Custom Fonts in an HTML site?
Hello Readers!
Fonts — What are they? The way we write text, the way we want text to appear to a user. i.e. , it is the style in which letters, numbers, punctuation and special characters are visually presented.
Fonts are not on...
Explaination of CSS3 animation
Hello Readers!
In this blog, I am going to explain the concept of CSS3 Animations in simple words
CSS3 animation is used to animate the text from one CSS style to another and adding many effects to it.
Animations consist of two building bloc...
Stitched Effect using CSS
we can achieve numerous effects by simply using CSS, we just need to use our innovativeness and creativity. This time, as the title recommends, we are making stitched effect by simply using CSS.
For creating stitched effect, first, we hav...
How to Create a Corner Ribbon With The Help Of Css
In this blog, I am going to demonstrate to you proper methodologies to make a corner ribbon with the help of css by utilizing various css properties for example with the help of transform, box-shadow and position we can make corner rib...
Embedded powerpoint presentation in your website
Hi there!
This blog post will tell you how to add Powerpoint slide presentation in your websites. We add images, colors, figures, charts etc and many other things in our website to make it look more interactive and appealing. Powerpoint presen...
How to draw different shapes with canvas?
Hello readers, today we will discuss canvas element for drawing different shapes like triangle and square. Canvas element of HTML is used to draw graphics on the web page. In my example, I am using this element to draw a triangle and square...
HTML Symbols
Here is the brief introduction about the HTML symbols.
There are various mathematical or other symbols, which are not available on keyboard. In HTML we cannot add the angle sign with text, because it will take it as a tag. So we use HTML symbo...
id vs class attribute
There are many different kind of CSS selector which we can use to apply CSS style to an element in html. ID and Class are one of them. Here, in this this blog, I am going to explain you the basic difference between these two :-
1. I...
Chapter 3: HTML5 Attributes
Hello Readers,
In the previous chapter we learn about html5 element, and now we learn about attributes
So, basically we have two type of attributes in html5 first can be used with any element so we define them globally and others are define...
Chapter 2: HTML5 syntax
Hi All,
HTML5 is much smarter, so its need simple syntax to specify it, Few of them are below:
Quotes are optional for attributes.
Uppercase tag names.
Closing empty elements are optional.
Attribute values are optional.
...
Chapter 1: An Introduction to HTML5
Hello readers,
This is the my first post for html5 tutorial. Here are some basics for HTML's which will help you for the forthcoming post.
HTML5 is the most latest version of HTML. HTML5 is a markup language HTML documents described by ...
Type attribute of script and style ?
Hello Readers,
Probably sometimes you see it when you use internal CSS, internal JS or in link text, and you are not if you are not using this (eg.- type="text/css"), also your script and CSS works.
So why we need this?
In the ...
HTML Embed Multimedia
Many times you have to include music or video into your website. The most effortless approach to add video or sound to your website is to use the HTML tag called <embed>. This label makes the web browser to itself incorporate controls for t...
What is favicon?
Favicon was first used in march 1999, when Microsoftft released Internet Explorer 5 that time it was used to make tabs a favorites (bookmarks).
Favicon is a small square 16×16 pixels image, Basically It is used on tab at the web browsers...
Use of dir attribute in Html
dir attribute:
It is used to specify the direction of text in Html element content. In Html5 it can be used with any html element. Prior to Html5 it cannot be used with <base>, <br>, <frame>, <frameset>, <hr>, <...
Create a HelloWorld application using angularJS
Generally any angularjs application requireds a following components:
1. ng-app - This component is required to make a links between the AngularJS application and the HTML.
2. ng-model - This component is required to bind the values of AngularJ...
Parallax Scrolling
Hello everyone!!
Parallax Scrolling is in which foreground content and background content are moved with different scrolling rate. In parallax scrolling we can use the different content in different scrolling position.
code:-
&...
Add twitter feed to website
If you want to embed multiple Tweets on our website in a compact, single-column view and want to display the latest Tweets from a single Twitter account for this a Twitter collection may be rendered in either a list or a responsive grid template....
Difference between HTML and XHTML
HTML and XHTML are both languages in which web pages are designed.
HTML-
HTML stands for Hypertext markup language. It is the main markup language which is used to design web pages.
HTML elements are not case sensitive.
e.g of HTML-
...
Difference between bootstrap and foundation
In web designing world, we define framework as a package made up of a files structures and folders of systematic code that include HTML, CSS, JS etc. which is used for the development of websites, as a base to start building a site. W...
Difference between HTML and XML
To know the difference between HTML & XML, first of all we need to know what is HTML and XML.
What is HTML :- HTML(Hyper Text Markup Language ) is a markup language used for describing web pages.
What is XML :...
Relatives font sizes in css
Hi Readers,
In this blog, I am going to discuss relatives font size in CSS as per screen resolution.
Being a ui developer one should have proper knowledge about all the measurement units while making a responsive design using CSS.
First of...
How to make your divs to display horizontally not Vertically
Hello Readers, this is a small blog on making divs display horizontally not vertically. Here is a very simple and easy code that will make divs to stack horizontally.
To achieve this we will make HTML page and CS...
Fit an image in the absolute center of a div and keep the aspect ratio
Hello readers, this is a small blog on auto resize of an image by keeping its aspect ratio and display image horizontally and vertically in the center of the div.
Here is very simple and easy method to solve this problem of displaying image in...
New Concept to Build HTML for big projects
We all know that for any web page or website, HTML is compulsory. HTML is the necessary platform to develop the website. Many times when I created HTML templates, I faced the issue to do the changes and had to do copy paste the changed content in...
Checkbox and Radio Buttons using Bootstrap(Touch Friendly)
Hello Readers,In my example I have simply created Radio and Checkbox buttons using Bootstrap framework.
We basically use checkboxes when we need to select one or several options from a given list while radio buttons are used for selecting one ...
custom scrollbar using jQuery UI
A scrollbar is a communication method or gadget in which nonstop content, pictures, or some other substance can be looked in a foreordained heading (up, down, left, or right) on a PC showcase, window, or viewport so that the majority of the subst...
Image Flipping Effect By Css
Flipping Image can be extremely valuable these days. The most basic use-case for flipping images that I can consider would incorporate some sort of image on the front, and some data related to it on its back.
By using below code we can u...
