1. ソースコードの例
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>CSS3的[att^=val]选择器</title><style type="text/css"> [id^=div_border]{ background-color:#9F6; width:160px; font-family:微软雅黑; font-size:18px; font-size-adjust:!important; font-stretch:expanded; font-style:oblique; font-variant:inherit; font-weight:bolder; alignment-adjust:after-edge; alignment-baseline:alphabetic; marquee-speed:normal; } [id^=child]{ background-color:#C00; animation:ease-in; word-break:break-all; font-size:24px; font-style:italic; color:#30F; }</style></head><body> <div id="div_border"> <ol> <li id="child1">星期一</li> <li id="parent">星期二</li> <li id="childchild">星期三</li> <li id="sonchild1">星期四</li> <li id="son">星期五</li> <li id="sonchildson">星期六</li> <li id="childsonparent">星期日</li> </ol> </div></body></html>
3. 説明
で表される要素の属性値の開始文字の場合att が val で指定された文字が使用されている場合、要素はこのスタイルを使用します