iskm/learnxinyminutes-docs
1
0
Fork 0
mirror of https://github.com/adambard/learnxinyminutes-docs.git synced 2024-12-23 17:41:41 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

corrected definition of ~ selector, added |

Browse Source 
[attr~='foo'] will not select <el attr="foobar">, it will only select <el attr="bar foo baz">

Also added definition for [attr|='pre'] style selector

Refs: https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors, http://jsfiddle.net/awalGarg/72k3ptsk/
This commit is contained in:
awalGarg 2015-02-19 00:15:12 +05:30
parent a1d966618b
commit e1667cc836
1 changed files with 6 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
css.html.markdown
View File

@ -43,7 +43,7 @@ You can target all elements on the page using asterisk! */
/* /*
Given an element like this on the page: Given an element like this on the page:
<div class='some-class class2' id='someId' attr='value' /> <div class='some-class class2' id='someId' attr='value' otherAttr='en-us foo bar' />
*/ */
/* you can target it by its name */ /* you can target it by its name */
@ -70,8 +70,11 @@ div { }
/* or ends with (CSS3) */ /* or ends with (CSS3) */
[attr$='ue'] { font-size:smaller; } [attr$='ue'] { font-size:smaller; }
/* or even contains a value (CSS3) */ /* or select by one of the values from the whitespace separated list (CSS3) */
[attr~='lu'] { font-size:smaller; } [otherAttr~='foo'] { font-size:smaller; }
/* or value can be exactly “value” or can begin with “value” immediately followed by “-” (U+002D) */
[otherAttr|='en'] { font-size:smaller; }
/* and more importantly you can combine these together -- there shouldn't be /* and more importantly you can combine these together -- there shouldn't be