Tutorialspoint

Are new HTML5 elements like <section> and <article> useless?

I have always wondered why the HTML5 elements <section> and <article> introduced. The tag also created section, then why these elements introduced.
Chandu yadav
Answered on 5th Apr, 2018

The elements <section> and <article> are useful for screenreaders as well and help visually impaired users in reading the content of your web page. These are beneficial for eBook readers as well.Let us see how to work with both the elements.<section><!DOCTYPE html> <html>    <head>       <title>HTML Section ... Read More

Apply style to the parent if it has a child with CSS and HTML

Are parent selectors present in CSS? I want to style to parent id it has a child with CSS and HTML.
mkotla
Answered on 21st Mar, 2018

Parent selectors are not present in CSS3. There is a proposed CSS4 selector, $, to do so, which could look like this (Selecting the li element):ul $li ul.sub { ... }As an alternative, with jQuery, a one-liner you could make use of would be this. The: has() selector selects all ... Read More

Flexbox and vertical scroll in a full-height app using newer Flexbox API with HTML

How to set Flexbox and vertical scroll in a full-height app using Flexbox API? What is the usage of the flex property?
Chandu yadav
Answered on 21st Mar, 2018

The flex property is a shorthand for the flex-grow, flex-shrink, and the flex-basis properties .The flex property sets the flexible length on flexible items.For example:#container article {    -webkit-flex: 1 1 auto;    overflow-y: auto;    height: 0px; /*here the height is set to 0px*/ }If you want a min-height, ... Read More

The correct way to work with HTML5 checkbox

I am working on HTML5 these days. What is the perfect way to work with HTML5 checkbox? I want to set it for: ,
Giri Raju
Answered on 21st Mar, 2018

The following is the correct way:<input name = "your_name" value = "your_value" type = "checkbox">Here is an example:<!DOCTYPE html> <html>    <head>       <title>Checkbox Control</title>    </head>    <body>       <form>          <input type = "checkbox" name = "maths" value = "on"> Maths ... Read More

Prevent iPhone from zooming in web-app with HTML

How can I prevent iPhone from zooming in on ‘select’ in a web app with HTML? I want to restrict the user from zooming.
Samual Sam
Answered on 21st Mar, 2018

Giving a meta tag attribute "user-scalable=no" will restrict the user from zooming elsewhere.  Prevent zooming all together by adding this meta tag to your head tag. This tells the mobile browser to use the same width scale and will not allow the user to zoom in at all, hence also disables ... Read More

HTML5 Cross Browser iframe post message - child to parent?

I want to apply HTML5 cross-browser iframe post message from child to parent. Which method or property should I use?
George John
Answered on 21st Mar, 2018

The parent object provides a reference to the main window from the child.The following is the parent code. The directive below triggers the iFrame to send a message to the parent window every 3 seconds. No initial message from the main window needed!var a= window.addEventListener ? "addEventListener" : "attachEvent";// here ... Read More

HTML 5 versus XHTML 1.0 Transitional

I am working on HTML5 and ear to know the difference between HTML5 and XHTML 1.0 Transitional. How can I convert HTML to XHTML?
varun
Answered on 21st Mar, 2018

HTML is expressed as SGML and XHTML is expressed in XML. Creating XHTML is connected with more restrictions in the form of markup.Avoid using the <video> or <audio> tags in XHTML 1.0 Transitional, as those are not an element of that specification.Convert from HTML to XHTMLAdd an XHTML <!DOCTYPE> to ... Read More

How to make the main content div fill height of screen with CSS and HTML

Which property should I use in HTML to make the main content div fill height of screen with CSS? I want to set the position of the element to be absolute as well.
Lakshmi Srinivas
Answered on 21st Mar, 2018

The position property specifies the type of positioning method used for an element (static, relative, absolute, fixed, or sticky).In the below-given example, no height is specified in percentage and no jQuery is needed.mainbody{      position: absolute;//here we are setting the position of an element as absolute    top: 30px; ... Read More

Get pixel color from canvas with HTML

I want to get the pixel color from HTML5 canvas. The color should be in rgba format. How can I achieve this?
Maheshwari Thakur
Answered on 21st Mar, 2018

To get the pixel color from canvas, use the following code. This returns the color in rgba:var index = (Math.floor(y) * canvasWidth + Math.floor(x)) * 4 // color in rgba var r = data[index] var g = data[index + 1] var b = data[index + 2] var a = data[index + 3]

Not showing a placeholder for input type=“date” field with HTML5. How to solve it?

I want to solve an issue I am facing right now as a placeholder. The placeholder for input type=”date” filed with HTML5 is not visible.
Giri Raju
Answered on 21st Mar, 2018

To show it, use the following:<input placeholder = "Date" class = "textbox-n" type = "text" onfocus = "(this.type = 'date')"  id = "date">You can also go for CSS:input[type="date"]::before{    color: #ffffff;    content: attr(placeholder) ": "; } input[type="date"]:focus::before {    content: "" !important; } Read More

Animating canvas to infinitely animate the noise to give the appearance of movement in HTML

Which method should I use to place the image data onto the canvas? How to animate canvas to infinitely animate the noise?
karthikeya Boyini
Answered on 21st Mar, 2018

The putImageData() method places the image data onto the canvas. To animate canvas, we create a reusable ImageData object outside the main loop, var ct = c.getContext("2d", {alpha: false});       // context without alpha channel. var a = ct.createImageData(c.width, c.height);   var buffer = new Uint32Array(a.data.buffer);   ... Read More

Place autofocus in the text box when a page gets loaded without JavaScript support in HTML?

I want to place autofocus in the text box. When the page loads without JavaScript, the focus should be in the text box.
George John
Answered on 21st Mar, 2018

The autofocus attribute is a boolean attribute. When present, it specifies that an <input> element should automatically get focus when the page loads. An example is given below<!DOCTYPE html> <html>    <body>       <form action = "/new.php">          First Name: <input type = "text" name ... Read More

Style options for the HTML5 Date picker

What are the style options to be available for HTML5 Date Picker? I want to add spacing and change the color scheme of the date picker.
mkotla
Answered on 21st Mar, 2018

The date picker in HTML5 basically works very similar to how the JavaScript Libraries did, when we focus on the field a calendar will pop out, and then we can navigate through the months and years to select the date.Therefore, if you want the date input to use more spacing ... Read More

Is there a way to add/remove several classes in one single instruction with classList in HTML and JavaScript?

How should I add or remove more than one classes in a single instruction with classList in HTML and JavaScript? Which methods should be used?
Samual Sam
Answered on 21st Mar, 2018

The classList property returns the class name(s) of an element, as a DOMTokenList object. The classList property is read-only, however, you can modify it by using the add() and remove() methods.The classListproperty ensures that duplicate classes are not unnecessarily added to the element. In order to keep this functionality, if ... Read More

Change colour of an image drawn on an HTML5 canvas element.

I want to change the color of an image that is drawn on an HTML5 canvas element. Which method is to be used for this?
radhakrishna
Answered on 21st Mar, 2018

In order to change colour of image drawn on an HTML5 Canvas element, you can try to run the following code. Use the drawImage() method:function display(img1, red, gr, bl) { //func to change color of image     var canvas1 = document.createElement('canvas');//canvas element initialisation canvas1.width = img.width;//canvas width initialisation ... Read More

Advertisements
Loading...
Unanswered Questions View All