テキストをCSS用にエスケープするオンラインツールを作ってみた
公開:
更新:
テキストをCSS用にエスケープするツールを作ったので、一応紹介しておきます。
CSSのcontent
プロパティなどでテキストを書くときなど、そのまま書いてもいいのですが、日本語などの場合は文字コードが面倒くさいのでエスケープした文字列を入れておくと便利だと思っています。font-family
の指定とかに使うこともあるかもしれません。
この辺の話はWebTecNoteさんの「[css] contentプロパティで挿入できるコンテンツ」という記事が分かりやすいです。
で、上記リンク先にも今回作ったものと似たような変換機があって、以前はよく使わせてもらっていたのですが、何と言うか、練習も兼ねて自分で作ってみたいと思ったわけです。
まあ自分なりに使いやすいものができたかと思います。
使い方は上のテキストエリアに好きな文字列を入れるだけです。
あ、改行も変換されますので注意してください。
書いたものが変換されない場合、一旦フォーカスを外すなどして下さい。
それと、多分IE 8未満では動きません。
❤
とか✿
とか☂
みたいなのでも大丈夫です。
こういう文字は『i2Symbol』でたくさん見られますので、そういうところで探すといいんじゃないでしょうか。
元は自分用に作ったツールですが、よかったら使ってみてください。
あ、あと、テキストのエンコードなら下の2つがお勧めです!