HTML | DOM Style listStylePosition Property Last Updated : 08 Aug, 2022 Comments Improve Suggest changes Like Article Like Report The DOM Style listStylePosition property sets or returns the position of the list-item marker. Syntax : For set the listStylePosition property:object.style.listStylePosition = valueFor return the listStylePosition property:object.style.listStylePosition Return Value: This return a String that representing the position of the list-item marker. Values: ValueDescriptionoutsideThis is default and specifies that list-item marker will be rendered before any text content.insideThis indents the list-item marker.initialThis sets this property to its default value.inheritThis inherits this property from its parent element. Example-1: Use of "inside" value. html <!DOCTYPE html> <html> <head> <title> HTML | DOM Style listStylePosition Property </title> <style> li { background-color: lightgreen; } div { padding: 20px; width: 70%; height: 40%; border: 2px solid green; } </style> </head> <body> <div> <p>Welcome to GeekforGeeks.!</p> <ul id="mainUL"> <li>item_1</li> <li>item_2</li> <li>item_3</li> </ul> </div> <br> <input type="button" value="click Me.!" onclick="mainFunction()" /> <script> function mainFunction() { // set position 'inside' document.getElementById( "mainUL").style.listStylePosition = "inside"; } </script> </body> </html> Output: Before click: After Click: Example-2: Use of "outside" value. Since this is default value so we can check by simply return The list-style-position property. html <!DOCTYPE html> <html> <head> <title> HTML | DOM Style listStylePosition Property </title> <style> div { padding: 20px; width: 70%; height: 40%; border: 2px solid green; } </style> </head> <body> <div> <p>Welcome to GeekforGeeks.!</p> <!-- set position 'outside' --> <ul id="mainList" style="list-style-position:outside;"> <li>item_1</li> <li>item_2</li> <li>item_3</li> </ul> <br> <input type="button" value="click Me.!" onclick="mainFunction()" /> </div> <script> function mainFunction() { // Return position using alert. alert(document.getElementById( "mainList").style.listStylePosition); } </script> </body> </html> Output: Before click: After click: Supported Browsers: The browser supported by HTML | DOM Style listStylePosition Property are listed below: Google Chrome 1Edge 12Mozilla Firefox 1Internet Explorer 4Opera 3.5Safari 1 Comment More infoAdvertise with us K kundankumarjha Follow Improve Article Tags : Web Technologies HTML HTML-DOM HTML-Property Similar Reads HTML | DOM Style textIndent Property The DOM Style textIndent Property is used for indentation of the first line in each block of text. It also takes negative values. If the value is negative then the first line will be indented to the left. Syntax: It is used to set the textIndent property:object.style.textIndent = "length|%|initial|i 2 min read HTML DOM Style paddingLeft Property The Style paddingLeft property in HTML DOM is used to set or return the left padding of the element. Syntax: It returns the paddingLeft property. object.style.paddingLeftIt sets the paddingLeft Property. object.style.paddingLeft = "% | length | initial | inherit"Return value: It returns the string v 2 min read HTML DOM | Style paddingRight Property The Style paddingRight property is used for setting or returning the right padding of an element. The padding property inserts the user desired space within the border of an element. Syntax : To get the property:object.style.paddingRightTo set the property:object.style.paddingRight = "%|length|initi 2 min read HTML | DOM Style pageBreakBefore Property The pageBreakBefore property in HTML DOM is used to set or return the page-break-before characteristics before the specified element in HTML document. This property works in print and print preview mode. The pageBreakBefore property has no effect on absolutely positioned elements in the HTML DOM. Th 2 min read HTML | DOM Summary Object The DOM Summary Object is used to represent the HTML <summary> element . The Summary element is accessed by getElementById(). Syntax: document.getElementById("ID"); Where “id†is the ID assigned to the “summary†tag. Example-1: html <!DOCTYPE html> <html> <head> <title> 2 min read HTML | DOM Style userSelect Property The DOM Style UserSelect Property is used to set or return whether the text can be selected by the user or not. Syntax: It is used to return the property: object.style.userSelectIt is used to set the property: object.style.userSelect = "auto|none|text|all" Properties : auto: It has the default value 2 min read HTML | DOM Title Object The Title Object in HTML DOM is used to represent the HTML <title> element. The <title> element can be accessed by using getElementByTagName() method. Syntax: document.getElementByTagName(); Properties: The title object contains single property text which is used to set or return a text 2 min read HTML DOM | Style paddingLeft Property The Style paddingLeft property is used for setting or returning the left padding of an element. The padding property inserts the user desired space within the border of an element.Syntax : To get the property: object.style.paddingLeftTo set the property: object.style.left = "auto|length|%|initial|in 2 min read HTML | DOM Style paddingBottom Property The Style paddingBottom property is used for setting or returning the bottom padding of an element. The padding property inserts the user desired space within the border of an element. Syntax: To get the property:object.style.paddingBottomTo set the property value:object.style.paddingBottom = "%|len 2 min read HTML DOM Style outlineOffset Property The Style outlineOffset property in HTML DOM is used to set or return the outline offset and draw it beyond the border edge. Outlines do not take space, unlike borders. It returns a string that represents the outline-offset property of an element. Syntax: Return the outlineOffset property.object.st 1 min read Like