The HTML DOM select name property returns and modify the value of the name attribute of the drop-down list in an HTML document.Following is the syntax −Returning nameobject.nameModifying nameobject.name = “text”ExampleLet us see an example of HTML DOM select name property − Live Demo html{ height:100%; } body{ text-align:center; color:#fff; background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) center/cover no-repeat; height:100%; } p{ font-weight:700; font-size:1.2rem; } .drop-down{ width:35%; ... Read More
The HTML DOM select value property returns and modify the content of the value attribute of a drop-down list.SyntaxFollowing is the syntax −Returning valueobject.valueModifying valueobject.value = true | falseExampleLet us see an example of HTML DOM select value property − Live Demo html{ height:100%; } body{ text-align:center; color:#fff; background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) center/cover no-repeat; height:100%; } p{ font-weight:700; font-size:1.1rem; } .drop-down{ width:35%; ... Read More
The HTML DOM select size property returns and modify the value of the size attribute of a drop-down list.SyntaxFollowing is the syntax −Returning sizeobject.sizeModifying valueobject.size = “number”ExampleLet us see an example of HTML DOM select size property − Live Demo html{ height:100%; } body{ text-align:center; color:#fff; background: radial-gradient( circle farthest-corner at 23.1% 64.6%, rgba(129, 125, 254, 1) 0%, rgba(111, 167, 254, 1) 90% ) no-repeat; height:100%; } p{ font-weight:700; font-size:1.1rem; } ... Read More
Use the CSS : valid selector to style all elements with a valid value .ExampleYou can try to run the following code to implement the :valid SelectorLive Demo input:valid { background: red; color: white; } Heading The style (red color background) appears if you type a relevant/ valid email address.
To highlight active HTML anchor with CSS, use the :target selector.ExampleYou can try to run the following code to implement the :target Selector:Live Demo :target { border: 2px solid #D4D4D4; background-color: orange; color: white; } Click any of the subject below. Maths Java C++ C This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. Maths Tutorial Java Tutorial C++ Tutorial C Tutorial
To style every element that is not the specified element, use the CSS :not(selector) selector.ExampleYou can try to run the following code to implement the :not selector:Live Demo p { color: red; } :not(p) { color: blue; } Heading 1 Heading 2 Heading 3 This is a paragraph. This is another paragraph.
The HTML DOM input number required property returns and modify whether the input number field must be filled out before submitting the form.SyntaxFollowing is the syntax −Returning requiredobject.requiredModifying requiredobject.required = true | falseExampleLet us see an example of HTML DOM input number required property − Live Demo html{ height:100%; } body{ text-align:center; color:#fff; background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) center/cover no-repeat; height:100%; } p{ font-weight:700; font-size:1.1rem; } input{ ... Read More
Use the CSS :target selector to highlight active HTML anchor with CSS.ExampleYou can try to run the following code to implement the :target SelectorLive Demo :target { border: 2px solid #D4D4D4; background-color: orange; color: white; } Click any of the subject below. Maths Java C++ C This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. Maths Tutorial Java Tutorial C++ Tutorial C Tutorial
To style document’s root element, use the CSS: root selector.ExampleYou can try to run the following code to implement the: root SelectorLive Demo :root { background: blue; color: white; } Heading This is demo text.
The position: sticky; property allows you to position an element based on scroll position. Set an element as sticky on the top when a user scrolls down.ExampleYou can try to run the following code to implement CSS position: sticky;Live Demo div.sticky { position: -webkit-sticky; position: sticky; top: 0; padding: 10px; background-color: orange; border: 1px solid blue; } Scroll and see the effect! Sticky! This is demo text. Scroll down to view the sticky div.