fontやcenterなどの指定を無効化する方法
Post on:2007年11月14日
サイトの更新時に、管理者や制作者の意図せぬ使い方で、<font>や<center>などの要素を更新者に使用されてしまうことがあります。
それを防ぐ方法の紹介です。
Disabling Deprecated HTML Using CSS
上記サイトでは、<font>, <basefont>, <center>, <strike>, <s>, <u>, bgcolor, border, align, vspace, hspace, valign, width, heightについて、CSSやJavaScriptを使用して、それらの指定の一部を無効化する方法が紹介されています。
example: <font>, <basefont>
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<textarea name="code" class="css" cols="60" rows="5"> font, basefont{ color:inherit; /* Standard browsers */ color:expression(this.parentNode.currentStyle['color']); /* IE */ font:inherit; /* Standard browsers. Font instead of font-size for Opera */ font-family:expression(this.parentNode.currentStyle['fontFamily']); /* IE */ font-size:100%; /* All browsers. Sizes are inherited */ } </textarea> |
上記のスタイルシートでは、<font>, <basefont>の、color, font-size, font-familyに対して、親要素の指定を継承するように指定がされています。
また、最近はあまり見かけなくなったblink, marquee, nobrについてもコメントに掲載がありました。
example: <nobr>, <marquee>, <blink>
1 2 3 4 5 6 7 8 9 10 11 |
<textarea name="code" class="css" cols="60" rows="5"> nobr{ white-space:normal; } marquee{ overflow:visible; -moz-binding:none; } blink{ text-decoration:none; } </textarea> |
個人的には、制作側で勝手に禁止してしまうのではなく、スタイルガイドに準じたデザインやユーザビリティなどの説明を行った方が、スムーズに更新を行っていただけるというのが経験則です。
もし、上記のような指定を行う場合、更新者に上記の仕様を伝えないと、何が起こったか分からなくなり混乱する場合があるので、目的と仕様をきちんと伝える必要があると思います。
sponsors