Typescale Save CSS Go Pro Login Typescale New Board My Boards Bookmarks Likes Explore Login Go Pro Support Terms Privacy © Typescale Board Settings Responsive Body size Scale Responsive Min-width Body size Scale Body Font Weight Line-height Letter-spacing Color Background Headings Font Weight Line-height Letter-spacing Color
a solution to control font-size relatively with media queries in Sass SCSS で media queries を使いながら、相対的に font-size を扱うよさ気な方法を思いついた。 I just conceived a good solution to control font-size relatively with media queries in Sass. settingsAt first, you can change… base font sizes, which is referenced by reading text like and othres… brakepoints for mediaqueries and here is the settings and mixins $font-si
http://typecast.com/blog/a-more-modern-scale-for-web-typography 1 comment | 0 points | by WazanovaNews ■ comment by Jshiike | 約3時間前 Jason Pamentalが、 例えば各デバイス共通で、H1がbodyの3倍(3em)、H2が2.25emと順に設定しても、画面サイズが小さくなりエレメントの数が減ると、相対的なサイズ設定のバランスは極端になってしまう。(参考画面) 特に、ヘッダーはこのように大きくなりすぎてしまう。 スマホ画面では、1行あたり35-40文字(英文テキスト)が読みやすそう。(参考画面: 35-40 vs. 40-50) メインのコンテンツエリアのまわりのマージンを減らして、コンテンツエリアを広げることができる。小さな画面では、bodyのcol
CSS で行ボックスの高さを指定する line-height 値に、em(length) や %(percentage) などの単位を付けて指定しているサイトを意外と見かける。それは間違いではないし、例えばナビゲーションとかでブロック要素の垂直センターに配置するために意図的に指定しているんであれば良いんだけれど、そうでないなら line-height 値には単位なし (number) で指定した方が良いのにとか思ったりする。その理由は Eric's Archived Thoughts: Unitless line-heights でも分かりやすく説明されているんだけど、ちと劣化コピーしてみる。 単位ありと単位なしの違い 手っ取り早く説明するために、サンプルを作ってみた。p 要素があって、その中にインライン要素の em で一部分を強調している。分かりやすいようにそれぞれの font-size
PC 版の Google Chrome や Safari で見たときにユーザビリティーが落ちるから。 以上。 で終わってしまうと記事にならないので、ちゃんと説明しておく。 そもそも -webkit-text-size-adjust とは何か iPhone や Android のブラウザーは、縦向き (Portrate mode) と横向き (Landscape mode) の文字サイズを自動調整する機能がある。 これを制御するのが CSS の -webkit-text-size-adjust である。 文字サイズ自動調整の具体例 次のような HTML をスマートフォンで表示してみる。 <!DOCTYPE html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-
The 10th Compass tutorial in the Sass tutorial series. This tutorial teaches you how to easily implement Vertical Rhythm using Compass. For more information on vertical rhythm, please see. http://compass-style.org/reference/compass/typography/vertical_rhythm/ http://24ways.org/2006/compose-to-a-vertical-rhythm Subscribe to Level Up Pro for extra features! https://www.leveluptutorials.com/store/p
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く