Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
Front End Technology Articles
Page 514 of 652
Set min-width and max-width of an element using CSS
To set the minimum and maximum width of an element, you can try to run the following codeExampleLive Demo div { max-width: 300px; min-width: 100px; background-color: red; } Below is a div with maximum and minimum width. Resize the web browser to see the effect. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. Output
Read MoreSet the height and width of an image using percent with CSS
To set the height and width of an image using %, you can try to run the following code −ExampleLive Demo img { height: 50%; width: 50%; } Sized image in %
Read MoreRole of margin property with value auto using CSS
The margin property with value auto is used to horizontally center the element within its container. You can try to run the following code to implement margin: auto;ExampleLive Demo div { width: 200px; margin: auto; border: 2px dashed blue; } This is demo text This is horizontally centered because it has margin: auto; Output
Read MoreRole of margin property with value inherit using CSS
The margin property with value inherit is used to inherit an element from the parent element. You can try to run the following code to implement margin: inherit;ExampleLive Demo div { border: 2px solid blue; margin-left: 50px; } p.ex1 { margin-left: inherit; } Inheriting left margin from the parent element This is demo text with inherited left margin. Output
Read MoreHow to get the content of a textarea using jQuery?
Here I am using one textarea and one button.The first textarea is used for user input then click the button and display the value in the alert box.Example Live Demo $(document).ready(function () { $("button").click(function () { var dim = $("#txt").val(); alert(dim); }); }); Click Here
Read MoreHow to count number of rows in a table with jQuery?
Example Live Demo table table,th,td { border:2px solid black; margin-left:400px; } h2 { margin-left:400px; } button { margin-left:400px; } $(document).ready(function () { $("button").click(function () { var rowcount = $('table tr').length; alert("No. Of Rows ::" +rowcount); }); }); HTML TABLE NAME AGE DD 35 SB 35 AD 5 AA 5 Click Here
Read MoreSet the color of the four borders using CSS
To set the color of the four borders, use the border-color property. You can try to run the following code to set border color for all the bordersExampleLive Demo p { border-style: dashed; border-color: #808000 #800000 #FF0000 #FFFF00; } This is demo text with four colored border. Output
Read MoreSet the width of the left border using CSS
To set the width of the left border, use the border-left-width property in CSS. You can try to run the following code to implement the border-left-width property −ExampleLive Demo p { border-style: dashed; border-left-width: 10px; } This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is ...
Read MoreSet the style of the bottom border using CSS
To set the style of the bottom border, use the border-bottom-style property. The values for the border you can set is, dotted, double, dashed, solid, etc.ExampleYou can try to run the following code to style bottom borderLive Demo p.dotted {border-bottom-style: dotted;} p.double {border-bottom-style: double;} p.dashed {border-bottom-style: dashed;} p.solid {border-bottom-style: solid;} p.inset {border-bottom-style: inset;} p.outset {border-bottom-style: outset;} Dotted bottom border. Double bottom border. Dashed bottom border. Solid bottom border. Inset bottom border. Outset bottom border. Output
Read MoreRole of CSS :nth-last-of-type(n) Selector
Use the CSS :nth-last-of-type(n) selector to select every element that is the second element of its parent, counting from the last child.ExampleYou can try to run the following code to implement the :nth-last-of-type(n) selector:Live Demo p:nth-last-of-type(2) { background: blue; color: white; } This is demo text 1. This is demo text 2. This is demo text 3. This is demo text 4. This is demo text 5.
Read More