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
5 Deadly Mistakes to Avoid During Web Design and Development
Hey there! We as web designers, strive for perfection in everything, specially when it comes to developing websites to the nearest pixel. Alongside, it is also important ...
Storing and Retrieve Value Using Session Storage in HTML5
Hello Everyone!!
In this blog, we are going to know about the Session storage in HTML5. As we know that web can store the data locally with in the browser. We can store the data using sessionStorage without affecting the pe...
Access Users' Geo-Location with HTML
Hello Everyone!!
Nowadays, We can use the HTML5 to find the Geo-location of the user. Earlier IP was the source of getting the location of the user so that we used additional scripting and also the calling of the server, but using h...
Chapter 5: Audio and video
HTML5 have native feature for audio and video facility and for it you do not need to have flash.
There are two tags <audio> and <video> it is very simple to add media in your website for it you just have to set the source path. B...
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...
Use of colgroup tag in html
<colgroup> tag:
It is used to apply different properties on more than one column in a table by grouping columns. Like with the help of this tag we can apply CSS on more than one column otherwise we have to apply CSS individually on each ...
Custom Tooltip using Html and CSS
Tooltip:
A tooltip is generally used to indicate hints (extra information) about something when the user moves the mouse pointer over an element.
We can use either bootstrap tooltip plugin or we can create our own tooltip using html a...
Use of accesskey Attribute in Html
accesskey Attribute:
Accesskey attribute is used in html forms and links. It provides the user to use keyboard keys for functions which are usually done by a mouse. Example: Like user clicks on links in a webpage using mouse , so with th...
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...
How to make the Zooming of the web page disabled?
On viewing the responsive website in our mobile device, the responsiveness of the website can be maintained via @media queries but on double click to the web page it will make a zoom effect in the device and than the horizontal scroll will appear...
How to make facebook share button on website?
Hello Reader's if you are developing the Ecommerce based website in which you want to integrate the facebook sharing option, then this blog is very helpful to you.
So lets start with the html doc.
To get Facebook sharing first you...
Bootstrap Navbar Menu without Javascript
The navbar menu is used in header or footer and in many cases in the content also. It is responsive by default in bootstrap and take size according to screen size.
The navbar get collapsed in case of small devices like mobile phones and there is...
Responsive menu
hii,
i am sharing a simple responsive menu code i.e html and css which you can use whenever you want to create a responsive menu.
HTML:
<div id='Responsivemenu'>
<ul>
<li class='first'><a href='#'><span&...
Implementing Slider with Angular UI Bootstrap
To create slider with angular UI, carousel is used as it is same as bootstrap's image carousel. But It also supports swiping in the touch devices. ngTouch is used to enable the swiping in the touch devices. We have to load ngTouch module as a...
TYPE OF LIST IN HTML
In html we use list attribute for arranging data in the form of list.
Their are two types of list in html.
Ordered List
Unordered List
ORDER LIST
If we want to put our data in numbered form rather than bullets then ordered list wil...
HOW TO TAKE INFORMATION FROM USER USING HTML FORMS
When we want to take(collect) information from user or those who are visiting site, for this purpose html forms are use.
for eg:- for user registration in any social site, we want to collect his personal information like his name,last name, ema...
TABLE TAG
If we want to print data in the form of table in html we use TABLE tag. Table contain rows and columns.
For creating rows in table we use
tr tag with in table tag.
For creating columns in table we use
td tag with in tr tag.
Syntax
...
@media Screen
Media rule in CSS is very attractive way to define different style rules for various types of screens(tablets/mobile screen) Media queries look at the capability of the device and be used to check various things:
Height and Width of the ...
HTML5 elements
HTML5 is having new elements, which helps the developer to make their document in the form that can be easily understood. By using HTML5 elements there is no need to use <div> again and again. This makes our work easier by using less number...
How to make Login and Signup in a single template
Hello Reader's if you are making the resposive website then you can make login and signup in same desing template.
Then you just have to create a front page in html and use the following code:-
<link href="//maxcdn.bootstrapcdn.com/font-...
How to make drag an drop in website
Hello Reader's if you want to use drag and drop feature in website then you can use the code as below:-
First create file drag.html and paste the following code in it.
<img id="source" src="../files/images/yourimage.jpg...
How to draw shapes using HTML5 tag
Hello Reader's! in this blog you will learn how to draw the shapes and figure using just html5 tags.
In html 5 you can draw some basic shape like square and rectangle and circles. Let's see some of them no
<svg width="300" height="100">...
How to write using custom font in HTML
Hello Reader's if you want to write special heading in the custom way in web page then you can use the custom html function as below:-
This function will take the font face and size from user and generate the given text into a picture.
&l...
How to insert special symbols in HTML
Hello Reader! If you are new to web desingning and you need to insert some special symbols in your web page then this blog is very helpful for you.
You might have seen copyright symbol , This type of symbol will only generate if you insert their...
How to put all the links target to sections of home
Hello readers if you want a single page website in which all the pages and links will be the sections of Home page. By using the bootstrap you can make it. Here you can see my code working as single page website.:-
<!DOCTYPE html>
...
The best Carousel slider for website
Hello Reader's if you are looking for the simple and light Slider to integrate into your website then Carousel slider is the best. You can take my code as below:-
<!DOCTYPE html>
<html lang="en">
<head>
<meta ch...
How to show animated image upload status bar
Hello Reader's if you are making the file upload in html form, Then you can also show the status of the file to upload.
Lets see the example code as below:-
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="styles...
How to make a download link ?
Hi Reader's,
Welcome to FindNerd, today we are going to discuss how to make a download link ?
So we will use HTML anchor download attribute for making a download link.Because The download attribute is used to specifies that the target will...
How to set multiple values in a option box
Hello Reader's!
If you need to set a option box with multiple select options then you can use the logic below:-
Logic is to set the name of your option box in array format, Like
<select name="flower[ ]" multiple>
Lets see the...
HTML datalist Tag
The datalist tag provides a list for options that are predefined for an input element in the html.
The datalist tag can be used to provide an "autocomplete" feature on input elements. After using this the predefined options list is made as we ...
how to use media query to make your page responsive in html?
Hello,
I am sharing an example of html with the use of mediaquery.
Here in the given example below in which i have used 3 separate files,namely
1:Html (a file with .html extension)
2:External css style sheet (a file with .css extensio...
Use of Span tag
Span tag plays a very important role in HTML, CSS designing.It is used to provide beautiful,attracting,as desired features to the attributes using CSS.
SPAN tag is a tag using which attributes can be implemented.
There many tags but we m...
Difference between id and class attribute
1) 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.
Using Class attribute are easier
as compared to id because of the
negative effects of an ID selec...
How to reload the webpage if user make no activity
Hello Reader's! If you are looking for functionality for reloading a web page only when user makes no activity for a while, Then you can use the ajax technology for making the html tag refresh.
Lets see the example below:-
<html>
...
HTML List attributes and types
HTML Lists
i)Unordered HTML Lists
An unordered list starts with the ul tag. Each list item starts with the li tag.
Unordered HTML Lists - The Style Attribute
1)Disc: All the list items will be marked with bullets.
eg:
<ul st...
html5 new input attribute- Part 2
Hello
This blog is in continuation with my previous blog about the html5 input attributes.
Here is the link:
html5 new input attribute
1)FORMMETHOD
This attribute is used for submiting data to the given action url overriding the metho...
Some Important HTML Codes for Blogging
Either you are a Professional Blogger or doing Guest posting just for Knowledge sharing you must face HTML code problems. I know HTML is a web designing/ programming language but I think every Blogger must know some Basic HT...
How To Create a Scrollspy in Bootstrap
With the help of Bootstrap we can create a Scrollspy function.The Scrollspy plugin is used to automatically update links in a navigation list based on scroll position. According to the below example, i am using data-spy=scroll it is used to scol...
How to Avoid HTML Mistakes
Hello Reader's
Here is the article which will help you to know, How to Avoid HTML Mistakes
In this article I will guide you how to avoid minor mistakes when create an HTML Page.
1) Don't use block elements within Inline elements.
**Wrong ...
How to Create Custom Jquery Tabs
Hello Reader's
In this article I will guide you how to create custom responsive tabs without use of any Jquery plugin.
This will surely make your web page faster because its not an plugin. Its an simple custom Jquery HTML & css.
Copy and p...
CSS filters
Hi all,
This is an experimental technology
Because this technology's specification has not stabilized, check the compatibility table for the proper prefixes to use in various browsers. Also note that the syntax and behavior of an expe...
How to make favicon for your website
Hi,
If you owning a website you might have seen logo's and banners for it, but there's also a little icon on top on tabs showing your website Icon. That icon is called as Favicon.
this is a icon format you can generate this easily with easy s...
CSS3 Selectors
pre{padding:4px;border-radius:0px;}
Hi all,
Selector are the basic component in the CSS. Here's a definition of the selector from W3C documentation -
A Selector represents a structure. This structure can be used as a condition (e.g. in...
How to Create a Responsive newsletter ?
Hello Users,
In the today world you can crate a responsive newsletter with help fo simple CSS.
You just follow 3 steps:-
1:- No Fixed Width
Generally we create f wrapper for a frame with fixed width. In this we can not use any fixed ...
THE BASIC STRUCTURE OF THE PAGE
<html><br>
<head><br>
<title>My Home Page</title><br>
</head><br>
<body><br>
<h1>This is a heading</h1><br>
<p>Document description goes here.....<...
How To Change Input Type File Title In HTML
We are change the input type file title with the help of this script
Like Browse Title Change in to Choice File
use this script for change Title
function browseclick(){
var fileinput = document.getElementById("browse"); // use in...
Filling Values in a html table dynamically
How to enter values in html table dynamically
Filling Values in a html table dynamically
//Below is the program to create a table structure dynamically.
//Input is taken from the User in 'Radius' TextBox and Unit is selected from 'Sel...