list-style-position Property

Home > Document > CSS > Classification > list-style-position

list-style-position Property

list-style-position Property는 글머리 기호나 문자가 문장 속에 들어가거나(inside), 문장 왼쪽 밖으로 따로 나와 있거나(outside) 의 여부를 다루는 Property 입니다. 기본 값은 outside이고, 아래의 DHTML 예제를 보시면 쉽게 이해 할 수 있는 Property 입니다.

[표 보는 방법]

list-style-position Property
Value	inside \| outside \| Inherit
Initial	outside
Applies to	elements with 'display: list-item'
Inherited	yes
Percentages	N/A
Media	Visual
HTML Syntax	{ list-style-position: sPosition }
Scripting	object.style.listStylePosition [ = sPosition ]

CSS Scripting

onMouseMove="this.style.listStylePosition='inside';"

list-style-position DHTML - outside

position - 1 position - 1 position - 1 position - 1 position - 1 position - 1 position - 1 position - 1 position - 1 position - 1 position - 1 position - 1
position - 2 position - 2 position - 2 position - 2 position - 2 position - 2 position - 2 position - 2 position - 2 position - 2 position - 2 position - 2
position - 3 position - 3 position - 3 position - 3 position - 3 position - 3 position - 3 position - 3 position - 3 position - 3 position - 3 position - 3

입력

<HTML>
    <HEAD>
        <TITLE>listStylePosition DHTML</TITLE>
    </HEAD>
    <BODY>
        <UL onMouseOver="this.style.listStylePosition='inside';"
                onMouseOut="this.style.listStylePosition='';">
            <LI>position - 1 position - 1 position - 1 position - 1 position - 1 position - 1 position - 1 
            position - 1 position - 1 position - 1 position - 1 position - 1 </LI>
            <LI>position - 2 position - 2 position - 2 position - 2 position - 2 position - 2 position - 2 
            position - 2 position - 2 position - 2 position - 2 position - 2 </LI>
            <LI>position - 3 position - 3 position - 3 position - 3 position - 3 position - 3 position - 3 
            position - 3 position - 3 position - 3 position - 3 position - 3 </LI>
            </UL>
    </BODY>
</HTML>

Top

Back

New

검색