備忘 #CSS 固定がわかりやすくしたい〜。線の色変えるとか、右上にマーク出すとか。 線の色はわかるけど、マークはどうすんだ。CSS知識が……ないです! 調べてね。 →枠線の色を緑に太めにした。あとマークもなんとか出してみた。 マークはcontentで特殊文字を指定して出した。 特殊文字を出すCSSの文は以下参照。今のマークが出てくる。 クラス名は適当。beforeとかあるけどそこら辺全然理解しきれていないので、そこは飛ばして特殊文字だけ出す。 .example{ content: "\2748"; } CSSでの特殊文字(に限らず文字全般)の指定はユニコード(16進数)で行う。U+〇〇〇〇の〇〇〇〇の4桁の頭に/をつけてcontentに突っ込むと出た。 htmlだとまた違うらしい。10進数とかなんとか言ってた気がする。htmlで出すぞ、になってから調べる。 ユニコードの確認方法について。Windows11の場合。 ①スタートメニュー>すべてのアプリ>windowsツール>「文字コード表」を開く。(タスクバーの検索窓から「文字コード表」を出すでも可) ②プルダウンメニューから使用するフォントを選ぶ。 ③文字にカーソルを重ねるとU+〇〇〇〇が表示される。 使いたいマークが決まっているならユニコード出してくれるサイトがあるのでそっち使った方が早い。自分はどのマーク使うかから考えていたので文字コード表使って色々なフォントを見てた。 出力位置はtopとかを弄った。 ちなみにcontentで出した文字はテキスト扱いではないのでコピペとか検索対象にならない。 特殊文字の場合は問題にならないが、通常の文字だと検索引っかからないのってUI的に不便かも、で割と好みが割れるっぽい。 2025/08/08
固定がわかりやすくしたい〜。線の色変えるとか、右上にマーク出すとか。
線の色はわかるけど、マークはどうすんだ。CSS知識が……ないです! 調べてね。
→枠線の色を緑に太めにした。あとマークもなんとか出してみた。
マークはcontentで特殊文字を指定して出した。
特殊文字を出すCSSの文は以下参照。今のマークが出てくる。
クラス名は適当。beforeとかあるけどそこら辺全然理解しきれていないので、そこは飛ばして特殊文字だけ出す。
CSSでの特殊文字(に限らず文字全般)の指定はユニコード(16進数)で行う。U+〇〇〇〇の〇〇〇〇の4桁の頭に/をつけてcontentに突っ込むと出た。
htmlだとまた違うらしい。10進数とかなんとか言ってた気がする。htmlで出すぞ、になってから調べる。
ユニコードの確認方法について。Windows11の場合。
①スタートメニュー>すべてのアプリ>windowsツール>「文字コード表」を開く。(タスクバーの検索窓から「文字コード表」を出すでも可)
②プルダウンメニューから使用するフォントを選ぶ。
③文字にカーソルを重ねるとU+〇〇〇〇が表示される。
使いたいマークが決まっているならユニコード出してくれるサイトがあるのでそっち使った方が早い。自分はどのマーク使うかから考えていたので文字コード表使って色々なフォントを見てた。
出力位置はtopとかを弄った。
ちなみにcontentで出した文字はテキスト扱いではないのでコピペとか検索対象にならない。
特殊文字の場合は問題にならないが、通常の文字だと検索引っかからないのってUI的に不便かも、で割と好みが割れるっぽい。