위젯 기본구성 / 제약사항
CSS 제약조건
다음과 같은 제약사항이 있습니다.
- media 문은 무시됩니다.
- @rule은 사용할 수 없습니다.
- CSS rule은 html, head와 그 아래에 속하는 태그를 포함할 수 없습니다.
- CSS rule은 특정 HTML id를 지칭하는 # 제어자를 사용할 수 없습니다.
- 다른 사항에 대해서는 사용자가 이용하는 브라우저의 기능을 따릅니다.
<style>
@import 'http://wzd.com/candy.css';
* { margin: 0; }
html { font-family: sans-serif; }
body { font-size: 75%; }
a { color: blue; }
a:hover { color: red; }
p { color: green; }
#container { width: 10em; }
.item { background: silver }
</style>
XHTML 제약조건
- id, accesskey 속성을 사용할 수 없습니다.
- onclick, onmouseover 등과 같은 이벤트 핸들러 속성을 사용할 수 없기 때문에 자바스크립트를 통해 동적으로 이벤트를 지정해야 합니다.
- a 태그의 href 속성은 "javascript:"로 시작하는 값을 가질 수 없습니다.
- Internet Explorer에서 인식하는 conditional comment는 지원하지 않습니다.
- h1, h2, h3 태그는 위자드팩토리와 위자드닷컴에서 다른 용도로 사용 중이므로 문서의 구조화를 위해 사용을 지양해 주십시오.
<body>
<ol class="football_club">
<li>Liverpool</li>
<li>Manchester United</li>
<li>Arsenal</li>
<li>Chelsea</li>
</ol>
<form id="search">
<fieldset>
<legend>선수 이름으로 검색</legend>
<input type="text" onfocus="highlight(this)" />
<input type="submit" class="submit" value="찾기" />
</fieldset>
</form>
<p><a href="javascript:window.open('http://www.premierleague.com/')">EPL</a></p>
</body>