osawaです。
今日は①cssでカーニング調整、②カップラーメンの秘密、③気分を上げる媒体、の3本です!
①cssでカーニング調整
先日Figmaでのカーニング方法をご紹介したので、今回は実装する際(css)のカーニング方法をご紹介します!
3つ方法があるので、その時の状況によって使い分けてみてくださいね!
- 等間隔に調整する方法 letter-spacingで調整する
.example{ letter-spacing: normal; }
上記のような形ですね。全ての文字間を調整することができるので便利!ですが、句読点など、細かい部分の調整はできないので、要注意!
-
特定部分を<span>で囲む
span.example{ margin-left: 10px; }
上記のような設定をすると1文字だけカーニングを調整したい時に便利!ですが、複数文字設定する場合には1文字1文字設定しなければならないため、コーディングに手間がかかります…
-
font-feature-settingsで自動調整
.example{ font-feature-setting: "palt"; }
上記のような記載方法です。日本語対応可で便利!ですが、OpenTypeフォントでしか利用できないみたいです。
※OpenTypeフォントとはフォントファイルフォーマットの1つみたいです。詳しいことはこちらから…https://wa3.i-3-i.info/word13830.html
“palt”の部分が、initialになるとデフォルトの設定になっていて、paltは自動文字詰め設定、pwidは文字ごとの幅を設定した字形等、横書きの設定はもちろん、縦書きの設定もあり、様々な設定方法があるのでこちらも上記のサイトから確認することができます!ぜひ確認してみてくださいね〜
②カップラーメンの秘密
今日、カップラーメンの蓋に少し変化があることに気づきました…
それは!蓋の部分に2つ開け口があることです!!
なぜ2つ開け口があるのか気になり調べてみたところ、2021年6月頃に「蓋止めシール」が廃止されたことが影響しているみたいです。
しっかりと蓋を閉められるように開け口を2つにしたんだとか…!(蓋止めシールはプラスチック削減のために廃止されたみたいですよ。)
最近カップラーメンを食べていなかったので、知らなかったです…!
何か話題に困った時使ってみてください〜😂
③気分を上げる媒体
今日は会社で懐かしい楽曲が多く流れていた気がします…(あ!あとEXILEの楽曲も流れてたかも!笑)
なんだか音楽って気分上がるな〜と考えていたら、昨日、「自分の気分を上げられる媒体はたくさん持っておいた方が良い!」というツイートを見つけたことを思い出しました。
メンタル的に、気分を上げられる媒体をたくさん持っていると良いみたいです。
私の場合、音楽(+ピアノ)とゲームと、YouTubeと、ドラマと、チョコレートと…意外とたくさんある…?笑
みなさんの気分を上げる媒体も気になります…ぜひ次回のブログ等で話題に困ったら教えてください♪
あ、気分が上がるといえば、今日は、hanawaさんとたくさん話して気分上がりました。
あと社長から久しぶりに「元気?」って聞かれて気分上がりました。エンジニアチームの皆さんとはあまり話す機会がないので、いつかお仕事で関わってお話しできたらいいな〜…でもそのためには自分自身のデザイン力を高めないとですね!osawa頑張ります🔥
ということで今週もお疲れ様でした!
WEB制作・ITに関するお悩みや
ご質問等お気軽にご相談ください