css note

1. css 伪类选择器last-of-type对class无效果

HTML:

<p class="visible">First paragraph.</p><p class="visible">Second paragraph.</p><p>Third paragraph.</p>

CSS:

p:last-of-type{
  /* this will be applied in the third paragraph bacause the pseudo-selector is applied  to nodes only */
  font-weight: bold;}p.visible:last-of-type {
  /* this does not get applied, because you are using a class-selector. */
  display: block;}

From the W3C:

The :last-of-type pseudo-class represents an element that is the last sibling of its type in the list of children of its parent element.

Because it has to be a sibling, it ignores classnames probably because then you can mix it up with other elements.

注意：此偽類對a標籤無效

2. css 伪类选择器last-child

last-child is used to select the last child element of a parent element. It cannot be used to select the last child element with a specific class under a given parent element.

For example, the below would style the last child li element with background color as red.

li:last-child{
    background-color: red;}

But, the below would not work.

li.complete:last-child{
    background-color: green;}

Refer to the answer posted by BoltClock, in this thread for more details. That is as comprehensive as it gets :)

注意：此偽類對a標籤無效

 

3. ie 漸變濾鏡

filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#f77e7e,endColorstr=#cccccc,grandientType=1);

注意grandientType的大小寫，對取值有影響

ie10以上不支持DX濾鏡

3.待續

 

转载于:https://my.oschina.net/homeemail/blog/307120