Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
The vertical line in the following is called Grid Columns.
Grid Elements in CSS has parent and child elements. Here’s an example wherein a grid is created with 6 elements.ExampleLive Demo .container { display: grid; grid-template-columns: auto auto; padding: 20px; } .ele { background-color: orange; border: 2px solid gray; padding: 25px; font-size: 20px; text-align: center; } Game Board 1 2 3 4 5 6
You need to add static content in CSS to make it work.Let us see an example −HTMLYou need to add the following CSS. This is to add CSS generated content before and after the HTML5 progress element −progress::-webkit-progress-bar:before, progress::-webkit-progress-bar:after { content: '989'; }
To avoid validation, use the formnovalidate attribute in HTML5. In the example, validation is disabled for the 2nd button −Example HTML formnovalidate attribute Rank
The HTML5 file Blob.slice() method is useful for creating a Blob object containing the data. This data is in the specified range of bytes of the source Blob.Let us see an example to send and receive binary data using slice(). This example sends a text and uses the POST method to send the "file" to the server −var val = new XMLHttpRequest(); val.open("POST", url, true); val.onload = function (event) { }; var blob = new Blob(['demo'], {type: 'text/plain'}); val.send(blob);
To display HTML5 geolocation accuracy on a Google Map, use the following code −var lat = position.coords.latitude; var longitude = position.coords.longitude; var accuracy = position.coords.accuracy; var center = new google.maps.LatLng(lat, longitude); var a = new google.maps.Marker({ position: center map: icon: }); var mySphere = new google.maps.Circle({ center: centerPosition, radius: accuracy, map: fillColor: fillOpacity: strokeColor: strokeOpacity: }); map.fitBounds(mySphere.getBounds());
To create a 3D sphere, use the HTML5 canvas. You can use the following function in your code:function display(r) { this.point = new Array(); this.color = "blue)" this.r = (typeof(r) == "undefined") ? 20.0 : r; this.r = (typeof(r) != "number") ? 20.0 : r; this.vertexes = 0; for(alpha = 0; alpha
For cross-origin data in canvas, add the following attribute to the
Use the autocomplete attribute for autocomplete text input. The autocomplete attribute is used with a form elements to set the autocomplete feature on or off. If the autocomplete feature is on, the browser will automatically show values, based on what users entered before in the field.If the autocomplete feature is off, the browser won’t automatically show values, based on what users entered before in the field.The following are the attribute values −S. NoAttribute ValueDescription1onThis is the default value. The browser automatically complete values based on what users entered before.2offThe browser won’t complete values based on what users entered before. Users have to ... Read More
To create a text inside circles in canvas, use the −context.beginPath();ExampleThe following is the canvas −$("#demo").on("click", "#canvas1", function(event) { var canvas = document.getElementById('canvas1'); if (canvas.getContext) { var context = canvas.getContext("2d"); var w = 25; var x = event.pageX; var y = Math.floor(event.pageY-$(this).offset().top); context.beginPath(); context.fillStyle = "blue"; context.arc(x, y, w/2, 0, 2 * Math.PI, false); context.fill(); context = canvas.getContext("2d"); context.font = '9pt'; context.fillStyle = 'white'; context.textAlign = 'center'; context.fillText('amit', x, y+4); } });HTML