Structure-behavior-style-CSS notes

Q: a DIV is set to position:relative, then his inside DIV or UL set to Position:absolute, so that the inside of the positioning is relative to the parent Div, if the parent Div does not add position:relative The style will be messy .

1,Position:absolute is based on his nearest position:relative | | sbolute | | fixed element positioning;

Q: How to solve the failure of using Z-index under IE8?

1. Replace Z-index with the combination of opacity and filter. Specific as follows:

Label-common-delete{position:absolute; left:0; top:0; width:100%; height:100%; z-index:10;}
. Label-common-delete span{

opacity:0.2;
-ms-filter: "Progid:DXImageTransform.Microsoft.Alpha (opacity=20)";
Position:absolute;
left:0;
top:0;
width:100%;
height:100%;
}

HTML code:

<a href= "Http://mj-staples.blog.163.com/blog/javascript:;" ng-class= "{' Label-common-adddelete ': Comm.showdelete} "

class= "Label-common-delete" ng-show= "Deletemask" ng-click= "Addlabeldelete (comm)" >

<i></i>

<span></span>

</a>

2, let the background image does not stretch, you can set his size:

      Background-size:

3, about Z-index

Z-index is based on the Div hierarchy to compare the level of the Div, and then compare the value of Z-index;

4, for mobile phone, CSS implementation arrow icon:

. arrow-right:after{
Content: ""; width:12px; height:12px;

border:2px solid #ccc;

Border-top-color:transparent;

Border-right-color:transparent; -webkit-transform:rotate (225DEG);

margin-left:8px;

Position:absolute;

right:17px; top:17px;
}

Structure-behavior-style-CSS notes