Display:block renders the child object as a block object. Many inline style effects need to be used for display.
<textarea id="runcode94414"><style type= "Text/css" > #photo a img{border:3px solid #FF6600;} #photo a:hover {display:block;} /** If this sentence is not added, the style of the inline object img does not display **/#photo a:hover img{border:2px solid Blue;} </style></textarea>
[Ctrl + A full selection Note: If you need to introduce external JS need to refresh to execute]
The size of the position content determines the size of the object based on the layout size.
<textarea id="runcode86128"><p><style type= "Text/css" > #text {position:relative;}/** if not, the inline object is not displayed. If block, the dashed line is too long as a block-level element. Posigion, the length is determined by the content of text. **/#text span{width:200px; height:20px;border-bottom:1px dashed #000000;} </style></P><P> <span> Example text underline style </span></P></textarea>
[Ctrl + A full selection Note: If you need to introduce external JS need to refresh to execute]
