Media Queryでminやmaxはもう使いたくない。全ブラウザ対応した範囲記法が直感的で便利

2023/03/28 100 users ＭＡＸ Safari CSS Media Query 筆者

筆者が CSS を学び始めたとき、media query で画面サイズに応じてスタイルを変える方法が大変ニガテでした😭 min？ max？ 未満のときはどうするの？ and で繋げなきゃいけないの？ 長くない？ と疑問に思いながら、今日まで長い年月を過ごしてきました。 本日（2023/03/28）、Safari 16.4 がリリースされ、 media query ... 続きを読む

CSSの三角関数（sin(), cos(), tan()）の基礎知識と基本的な使い方を解説

2023/03/23 146 users cos tan Sin CSS 三角関数

CSSで数式を使用するときには、今まではcalc()関数をはじめ、min(), max(), clamp()などの関数でしたが、ついに三角関数もChrome, Edge, Safari, Firefoxのすべてにサポートされました。 CSSの三角関数、sin(), cos, tan(), asin(), acos(), atan(), atan2()の基礎知識と基本的な使い方を紹介します。 Trigonometric fun... 続きを読む

これでUIデザイン用のSVGアイコンに困らない！ 1,700種類以上が揃った商用利用無料、改変・再配布可の太っ腹ライセンス- MingCute Icon

2023/02/20 286 users SVGアイコン 太っ腹ライセンス 改変 UIデザイン用 特徴

WebサイトやスマホアプリのさまざまなUIデザイン用に、シンプルで洗練されたデザインのSVGアイコンが完全無料で利用できるMingCute Iconを紹介します。 このアイコンの特徴は、小さいサイズでもくっきり見えること。1,700種類以上のアイテムが揃っており、すべてSVGアイコン、そしてWebフォントとして利用できます。 Min... 続きを読む

レスポンシブ対応のレイアウトやUIコンポーネントの実装が簡単！ min(), max(), clamp() の便利な使い方を詳しく解説

2022/10/13 118 users CLAMP ＭＡＸ UIコンポーネント CSS メディアクエリ

CSSの比較関数が主要ブラウザすべてにサポートされてから早2年が経ちました。これらの比較関数は、今まではJavaScriptを使用しないとできなかったこと、メディアクエリで複雑に実装していたことをシンプルなCSSで実装できます。 最近のWebサイトで使用されている、CSSの比較関数 min(), max(), clamp() の便利な使い方を... 続きを読む

iPhone「mini」ユーザーはどこへ向かうのか (1/3)

2022/09/10 204 users iPhone plus アップル ラインナップ mini

アップルが発表したiPhone 14シリーズには、小型の「mini」が存在しません。なぜこうなってしまったのか、そしてminiを使っていたユーザーはこれからどうすればいいのか、考えてみます。 miniと入れ替わりに「Plus」が追加 iPhoneのラインナップは、2020年のiPhone 12から「6.1インチ」の通常モデルと「5.4インチ」のmin... 続きを読む

CSS カスタムプロパティによる流動的フォントサイズ

2022/01/21 14 users フォントサイズ FON CLAMP Calc unit

今回は、calc() clamp() min() max() と CSS カスタムプロパティを駆使して、自分で計算する必要がなく、Sass なども不要で CSS のみでの実装を紹介いたします。 使い方と実装解説 デモとソースコード /** * Available vars: * @var --viewport-from: <number> - Number in pixels without the unit. Required if `--fon... 続きを読む

CSSの数学関数min()、max()、clamp()の基本的な使い方

2021/11/04 162 users CLAMP Calc font-size ＭＡＸ CSS

IEをサポートから外すと、CSSの便利な新しいプロパティが使用できます。その中の1つ、いや3つがmin(), max(), clamp()です。 数学関数といえばcalc()が便利ですが、さらに便利なのがこの3つです。要素の幅指定、padding値の管理、font-sizeの定義など、レスポンシブ対応で大活躍します。min(), max(), clamp()の基本的な... 続きを読む

JT M.D., Ph.D. on Twitter: "往診で治るビョーキじゃねーんだ。 点滴、酸素吸入も設備が無けりゃ出来ねーんだよ。 酸素吸入5L/minで1日7,200L必要なんだよ。液化酸素タンクのレベルなんだよ。今か

2021/08/06 262 users ビョーキ Ph.D 往診 点滴 酸素吸入

往診で治るビョーキじゃねーんだ。 点滴、酸素吸入も設備が無けりゃ出来ねーんだよ。 酸素吸入5L/minで1日7,200L必要なんだよ。液化酸素タンクのレベルなんだよ。今から医者になってから言えよ。バカ… https://t.co/PsKKsd5bpo 続きを読む

M1チップと新色で“時代の変化”を感じさせたApple新製品発表会を振り返る：林信行視点で振り返るAppleイベント（1/4 ページ） - ITmedia PC USER

2021/04/21 10 users USER 未明 バネ Podcastアプリ 圧力

日本時間で4月21日の未明に行われたApple新製品発表会、そのタイトルは「Spring loaded」だが、これはバネに圧力がかかって縮められている状態を意味する。今にも伸びて弾けそうな状態のことであり、発表会はまさにその通りで1時間弱のコンパクトな講演の冒頭7分で、Apple Card、Podcastアプリ、そしてiPhone 12／12 min... 続きを読む

これぞプロの実装テクニック！フロントエンドのデベロッパーはCSSで実装する時に何を考えるか | コリス

2020/12/08 358 users ＭＡＸ コリス UIコンポーネント デベロッパー スクリーン

ページのレイアウトやUIコンポーネントを実装する時に、フロントエンドのデベロッパーはいろいろなことを考えます。スクリーンのサイズが小さい時はどうなるのか、デザインでは中央配置に見えるけど実装はどうすべきか、要素が少ない場合や多い場合があるのか、max-やmin-を定義した方がよいのか、、、 フロントエンドの... 続きを読む

CSSの数学関数が便利すぎる！min(), max(), clamp()の使い方を詳しく解説 | コリス

2020/05/28 182 users CLAMP Calc コリス ＭＡＸ Firefox

CSSの数学関数と言えば、calc()が便利ですよね。 しかし、便利な数学関数はcalc()だけではありません！ 先月、Firefoxにサポートされたことにより、すべてのモダンブラウザにサポートされたCSSの数学関数「min()」「max()」「clamp()」の使い方を紹介します。 最大幅や最小幅を計算式で定義できる「min()」「max()」、フ... 続きを読む

CSSの便利なプロパティmin-widthとmax-width、min-heightとmax-heightの効果的な使い方のまとめ | コリス

2020/01/23 73 users min-width コリス width ＭＡＸ CSS

Webページやスマホアプリのレイアウトをはじめ、画像、ボタン、ナビゲーションなどを親要素に応じてそれらの幅や高さを適したサイズにしたい時がありませんか？ そんな時には、min-widthとmax-width、min-heightとmax-heightを効果的に使用すると、非常に便利です。 widthとheightプロパティにおけるminとmaxの効果的な... 続きを読む

「ミナ ペルホネン／皆川明　つづく」展、開催中 | タブルームニュース

2020/01/03 10 users ミナ　ペルホネン タブルームニュース perhonen 皆川

2020年2月16日(日)まで、東京・清澄白河の「東京都現代美術館」にて「ミナ ペルホネン／皆川明　つづく」が開催されています。 デザイナーの皆川 明氏と、彼が立ち上げたブランドのminä perhonen(ミナ ペルホネン)にフォーカスした展覧会。 1995年のブランド設立時からこれまでの思想や活動を辿り、現代におけるものづく... 続きを読む

ネイティブキャンプレッスン教材・トピックトーク「Family (家族)」 | 「ネイティブキャンプ(Native Camp)」でオンライン英会話三昧

2019/12/19 15 users Family Native Camp ネイティブキャンプ

久しぶりの教材を使ったレッスン【トピックトーク】 本日のレッスンテーマは「Family (家族)」 1) Warm-up (1 min) Let’s name all the things that you can see in this picture for 1 min. (絵から思いつく単語を全部言ってみましょう。) Q、上の二つのイラストを見て、一分間であなたは単語をいくつ言えましたか？ A... 続きを読む

【Excel関数】最大なのに下限のMAX、最小なのに上限のMIN - わえなび ワード＆エクセル問題集

2018/10/14 66 users 下限 Excel関数 ＭＡＸ 最小 上限

例えば、100点を超えないように加点するとか、マイナスになったら強制的に０にするとか、一律に上限や下限を設定することがあります。また、税金の計算では、上限10万円のことを「～の金額または10万円のいずれか小さいほう」というまわりくどい言い方をすることがあります。 Excelの場合、下限と上限の設定は MAX / MIN... 続きを読む

ミナ ペルホネンが6日限りの「小さなデパート」をオープン！ 特別アイテムも登場 | タブルームニュース

2018/04/01 23 users デパート ミナ　ペルホネン タブルームニュース 登場 刺繍

2018年3月28日(水)から4月2日(月)まで、 東京 ・ 新宿 の「 伊勢丹新宿店 本館7階 催物場」にて「 Dear Friend, Department 」が開催されます。 minä perhonen(ミナ ペルホネン) が小さなデパート「Dear Friend, Department」を期間限定でオープン。アーカイブテキスタイルの中からプリントや織りに刺繍を重ねたスペシャルファブリックを... 続きを読む

THE NORTH FACE × ミナ ペルホネンのキャンプスタイル！ 初のグッズアイテムも展開 | タブルームニュース

2018/03/20 73 users ミナ　ペルホネン THE NORTH FACE 展開

THE NORTH FACE × ミナ ペルホネンのキャンプスタイル！ 初のグッズアイテムも展開 2018/03/15 2018年3月16日(金)より、 THE NORTH FACE(ザ・ノース・フェイス) と minä perhonen(ミナ ペルホネン) のコラボレーションアイテム第4弾が発売されます。 アウトドアブランドのザ・ノース・フェイスと、独自のテキスタイルデザインを展開するファッショ... 続きを読む

私だったらここまでできるだろうか - 『男の産後うつ』になったようだけど女装したら治ったみたい

2017/07/14 13 users 産後うつ 町内会 花壇 やっつけ仕事 手入れ

2017 - 07 - 15 私だったらここまでできるだろうか その他 Twitter Google Pocket 【スポンサーリンク】 近所のとある公園には、よく手入れされた花壇があります。 町内会とか自治会とかで手入れをしているのだろうけど、やっつけ仕事とは思えない、手入れをしてくれた人の心を感じる花壇。 私だったらここまでできるだろうか――。 この公園を横切るたびに、頭をよぎります。 min... 続きを読む

『Minecraft』次期アップデートにてクロスプラットフォームプレイに対応。Xbox OneとNintendo Switchのプレイヤーが交流可能に | AUTOMATON

2017/06/11 26 users Minecraft AUTOMATON iOS プレイヤー

Microsoftは『Minecraft』の次期アップデート「Better Together Update」にて、Xbox OneやNintendo Switchといった機種にて、クロスプラットフォームプレイが可能になると 明らかにした 。対象となるデバイスはWindows 10/Xbox OneおよびiOS/Android、さらにVRデバイスとなっている。なお従来PCでリリースされてきた『Min... 続きを読む

【Unity】uGUIの自動レイアウトが分かりにくいと評判なので解説してみる - テラシュールブログ

2017/05/14 52 users uGUI NGUI Unity 旧UI 評判

2017 - 05 - 14 【Unity】uGUIの自動レイアウトが分かりにくいと評判なので解説してみる 2D Unity GUI（uGUI/NGUI/旧UI） uGUIには自動レイアウトなシステムが積まれています。ただ、このシステム便利ではあるんですが色々と複雑なので、少し補足です。 UIの大きさを動的にフィットさせる、オートレイアウト UIの大きさはLayoutElementで決まる Min... 続きを読む

【一覧付き】初心者は意外と知らない？便利な関数たち(Python3版) - paiza開発日誌

2017/03/27 73 users paiza開発日誌 dict 一覧付き 初心者 Range

2017 - 03 - 27 【一覧付き】初心者は意外と知らない？便利な関数たち(Python3版) プログラミング初心者 プログラミング学習 開発ネタ Photo by pycon jp 秋山です。 Python3を使って開発中＆勉強中の皆さん、組み込み関数はどれくらい覚えていますか？よく使うrange, input, min, max, dict……などしか覚えていないという人も多いかもしれま... 続きを読む

「Minecraft」を使った小中学生向けコンテスト「つくろうみんなの未来都市コンペティション」の受賞記念イベントが開催。最優秀賞は小学4年生のチーム - 4Gamer.net

2016/12/12 16 users Minecraft 最優秀賞 コンテスト スウェーデン大使館

「Minecraft」を使った小中学生向けコンテスト「つくろうみんなの未来都市コンペティション」の受賞記念イベントが開催。最優秀賞は小学4年生のチーム ライター：大陸新秩序 2016年12月10日，都内の駐日スウェーデン大使公邸にて， 「『つくろうみんなの未来都市コンペティション in Minecraft』受賞記念イベント」 が開催された。 スウェーデン大使館が主催したこのコンテストは，「『Min... 続きを読む

まつもとゆきひろさん，Rubyの変化で大事にしているルールを守りつつ「2019年までにRuby 3x3を実現したい」 〜RubyKaigi 2015基調講演 1日目：RubyKaigi 2015レポート｜gihyo.jp … 技術評論社

2015/12/24 40 users RubyKaigi Ruby ベルサール汐留 基調講演 ルール

12月11日～13日， ベルサール汐留にて 「 RubyKaigi 2015 」 が開催されました。今年も基調講演が毎日一つずつ行われました。その模様をレポートします。 RubyKaigi 2015初日の基調講演は まつもとゆきひろ さんです。 「Ruby 3 challenges」 と題して， 間もなくリリース予定のRuby 2. 3.0の紹介をしつつ， Ruby 3について話しました。 MIN... 続きを読む

ジバニャンの方程式がついに発見される　グラフに書くとかわいい姿がよーでる！ - ねとらぼ

2014/11/12 51 users ジバニャン 方程式 グラフ Akiyah とらぼ

「妖怪ウォッチ」の人気キャラ「ジバニャン」の方程式が、Akiya Mizukoshiさん（@Akiyah）によって発見されました。そのままだと単に長くて複雑そうな式ですが、グラフに書くとジバニャンが姿を表わすのです。 左の複雑な式から、ジバニャンがでるけん！ 式だけ見ると、minやmaxがいくつも登場するわカッコが何個も入れ子状態になっているわでとにかく難解そう。ジバニャン本来のポップさが皆無です... 続きを読む

【朗報】チ○コビンビンですよ神、実在していた : 暇人＼(^o^)／速報 - ライブドアブログ

2014/10/22 25 users ライブドアブログ ファルス 陰茎 朗報 豊穣

【朗報】チ○コビンビンですよ神、実在していた Tweet 1：風吹けば名無し＠＼(^o^)／：2014/10/22(水) 07:00:45.60 ID:QSFHL7ls.net http://ja.m.wikipedia.org/wiki/%E3%83%9F%E3%83%B3 ＞ミン（Min）は、エジプト神話の神。 ＞豊穣の神であり、ファルス（陰茎）を勃起した姿で描かれる。手には殻竿を持ち、頭には... 続きを読む