Display & position_CSS/HTML

Display & amp; position display: block: the sub-object is presented as a block object. Display is required for many inline styles.

<Style type = "text/css"> # photo a img {border: 3px solid # FF6600 ;}# photo a: hover {display: block ;} /** if this sentence is not added, the inline object img style will not display **/# photo a: hover img {border: 2px solid blue ;} </style> <p id = "photo"> </p>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]

The size of position Content determines the object size based on the layout size.

<P> <style type = "text/css"> # text {position: relative;}/** if no, the inline object is not displayed. If it is a block, the dotted line is too long as a block-level element. The length of posigion is determined by the text content. **/# Text span {width: 200px; height: 20px; border-bottom: 1px dashed #000000 ;} </style> </P> <p id = "text"> example text underline style </p> </P>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]