iOS・macOSと同時に大型アップデートがSafariにも到来、新たな「高さ」の基準やカスケードレイヤーが追加される

2022/03/15 129 users カスケードレイヤー Safari iOS・macOS 到来

2022年3月14日にmacOS Monterey 12.3およびiPadOS・iOS 15.4がリリースされ、同時にSafariが新しいバージョン「15.4」にアップデートされました。Google ChromeやFirefoxに先行搭載されている多数の機能が追加されたほか、動的に変化するビューポートのサイズに応じて要素の高さを決める「dvh」という新たな指定方法など... 続きを読む

CSSで複数の色を組み合わせたメッシュグラデーションを作成する方法

2022/01/05 10 users Bac CSS 遊び心 グラデーション 複数

2022年1月5日 CSS メッシュグラデーションとは、複数のポイントで色を指定したグラデーションのことです。あえて統一感をなくすことで、遊び心のあるふわふわした印象となります。このメッシュグラデーションをCSSで作成してみましょう！ 基本の円形グラデーション まずは基本的な円形グラデーションの指定方法です。bac... 続きを読む

useEffect()内でsetState()するのを減らすテク

2021/11/07 23 users プレゼンテーションロジック useEffect 挙動 テスト

コンポーネント上の useEffect() （or useLayoutEffect()） で複雑なことをすると、deps配列（第2引数）の指定方法などによっては、おかしな挙動を起こしうるのでなるべく避けたいです。何より、テストが面倒なプレゼンテーションロジックは、常にシンプルに保つ方がメンテナンスが容易になります。 複数の useEffect() ... 続きを読む

Amazon DLMとAWS BackupはEBSバックアップの世代管理方法が異なります ｜ DevelopersIO

2019/07/15 33 users DevelopersIO retain EBS バックアップ

EBS をバックアップする場合、選択肢として AWS Backup Amazon Data Lifecycle Manager (Amazon DLM) の2つがあります。 この2つはともにバックアップのライフサイクル管理が可能ですが、指定方法が異なります。 Amazon DLM はスナップショットを何個残すか(retain)指定し、AWS Backupは各スナップショットをどれだけの... 続きを読む

【CSS】見出しが変に改行しない！スマホのfont-size指定にvminを使ってみよう

2017/05/08 189 users vmin Photoshoptips font-size

creative memomemo Webデザインtips,Photoshoptips,クリエイティブでステキなものをまとめているブログ。 about contact スマホのfont-sizeの指定で良さげな指定方法を見つけたのでご紹介いたします。 特に見出しなんかの 大きな文字 を使用する場面で活用できそうです。 スマホあるある見出し改行しちゃう問題 スマホのコーディングしてると、見出しやキャ... 続きを読む

[CSS]レスポンシブ対応のフォントサイズの指定方法 -デスクトップやスマホのビューポート幅（vw）に対して文字サイズを変化させる | コリス

2017/03/10 134 users コリス フォントサイズ ビューポート幅 CSS 記述

CSSだけで、ルートのフォントサイズを元に最小値と最大値を指定し、その間のサイズはビューポート幅（vw）に対して自動で変化させるスタイルシートの記述を生成するオンラインツールを紹介します。 例えば、768px以下はすべて1rem、1920px以上は2rem、その間はvwに対して変化する、という指定が簡単にできます。 Responsive font calculator ツールの使い方は、簡単です。... 続きを読む

CSSの:nth-childと:nth-last-child擬似クラスの使用例 | NxWorld

2016/01/18 67 users nth-child NxWorld 備忘録 CSS 擬似クラス

今更な内容になりますが、未対応だったIEのサポート終了によって今後ますます使う場面は増えるでしょうし、恥ずかしながら指定方法によっては一瞬どう記述するかど忘れしちゃうことがたまにあるので備忘録も兼ねて。CSSの擬似クラスにある「:nth-child」と「:nth-last-child」の使用例を自分が見たい時にすぐ確認できるようひと通りまとめました。 説明時に利用しているサンプルイメージやソースは... 続きを読む

今どきのCSS3グラデーションの指定方法 (2015年版) - to-R

2015/11/09 72 users 今どき to-R CSS3グラデーション TOP 2015年版

昨年、「今どきのCSS3グラデーションの指定方法」という記事を書いてそこそこアクセスがあるのですが、今年にはいって状況が変わってきたのでアップデートしておきます。 まずは各ブラウザの対応状況。現在の正式な記述「linear-gradient (to bottom)」とちょっとレガシーな記述「linear-gradient (top)」、それと古いWebKit用のgradientプロパティの対応状況... 続きを読む

[CSS]フォントサイズの指定方法の基礎知識からレスポンシブに適した指定方法までやさしく解説 | コリス

2015/06/05 386 users コリス フォントサイズ レスポンシブ 相違 CSS

CSSでのフォントサイズの指定方法をその単位とそれぞれの相違から、レスポンシブに適したフォントサイズの指定方法までをやさしく解説します。 CSS Font Sizing 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 CSSでのフォントサイズの指定方法 各指定方法の特徴 レスポンシブに適したフォントサイズの指定方法 CSSでのフォントサイズの... 続きを読む

gulp-ruby-sass 1.0.0 から記述方法が変わるらしい | BUN:Log

2015/01/26 21 users Sass Bun コンパイル 書式 log

先日、gulp-ruby-sass 1.0.0-alpha にアップデートしたところ、Sass のコンパイルがエラーでコケるようになりました。 半年前に書いたgulp-ruby-sass 0.6 にアップデートしたらコケた話のように、オプションの指定方法が変わったのかな？と思いつつ公式リポジトリを確認したところ、タスク自体の書式が変わるようです。 sindresorhus/gulp-ruby-sa... 続きを読む

レスポンシブなウェブデザインをする際に役立ちそうなこと（主にスマホ対応）のまとめ｜Webpark

2014/06/12 225 users 備忘録的 メディアクエリ ウェブデザイン 小さいディスプレイ

レスポンシブにデザインしたサイトを作った際に役立ったこと（主にスマホ対応）を備忘録的にまとめてみます。いろんな方が同じような内容をまとめていますし、基本的なことも多いですがお役に立てばうれしいです。 メディアクエリの指定方法 小さいディスプレイから指定する場合と、大きいディスプレイから指定する場合があります。どちらにせよ、PC用、タブレット用、スマホ用と分けることが多いようです。まずは大きいディス... 続きを読む

今どきのCSS3グラデーションの指定方法 - to-R

2014/02/05 125 users 今どき to-R CSS3グラデーション TOP 記述

今どきかはわからないですがCSS3グラデーションの指定方法を再考してみました。 対応ブラウザ 現在の正式な記述「linear-gradient (to bottom)」とちょっとレガシーな記述「linear-gradient (top)」、それと古いWebKit用のgradientプロパティの対応状況を調べてみました(緑はベンダープリフィックスが必要)。ひとまず角度指定がどのバージョンから変更され... 続きを読む

iOSにおけるviewportの指定方法による細かい違い - to-R

2013/10/11 55 users viewport iPhone iOS width 挙動

iOSではviewportの指定方法が異なると細かいデバイスの挙動が変わってきます。 検証はiPhone(iOS6.1)のみで行っているのでiPadやiOS7ではちょっと違うかも。 まず、以下のような数値によるviewport指定をPCモードとし、 <meta name="viewport" content="width=960px"> 以下のようなdevice-widthによるviewport指... 続きを読む

[CSS]俺好みのfont-family指定が最強に読みやすくてオススメ！ | DevAchieve

2012/12/22 474 users DevAchieve font-family指定 CSS

2012/12/22 [CSS]俺好みのfont-family指定が最強に読みやすくてオススメ！ 俺のためにWeb開発者は俺にとって読みやすいフォント指定をするのだ！ 指定方法は下にあるぞ！ 新規でサイトを制作するのに基本のフォント指定を持っていなかったので 色々調べたり、このブログのフォント指定を変更してみたりしたら 実は Arial より Verdana のほうが見やすいことがわかってしまった... 続きを読む

meter 要素のスタイリングについてのメモ 2012年10月 | Unformed Building

2012/10/12 17 users meter WebKit Opera Firefox 要素

2011年1月27日に「meter 要素のスタイリングについてのメモ for webkit & Opera」という記事を書きましたが、先日リリースされた Firefox 16 でも meter 要素に対応し、また Webkit の指定方法も変更されていましたので改めてメモしておきます。 なお、前回同様に Opera についてはスタイリングの方法が分かりませんので(まだないっぽい)、Webkit と... 続きを読む

CDNでウェブサイトを高速化するためのまとめ: 小粋空間

2012/06/12 136 users CDN Con 小粋空間 まとめ ウェブサイト

CDNでウェブサイトを高速化するためのまとめです。 「そんなの知ってるよ」という方も多いと思いますが、バージョンの指定方法や、キャッシュ・フォールバックなど、CDNに関する情報を集めましたのでご覧いただければ幸いです。 認識誤り等ありましたらどこかでつぶやいてください。 １．CDNとは CDNとは「Contents Delivery Network（コンテンツデリバリネットワーク）」または「Con... 続きを読む

Googleの「＋」演算子による検索が二重引用符に変更されました : ライフハッカー［日本版］

2011/10/27 71 users ライフハッカー 演算子 二重引用符 Google プラス

Google , Webツール , 検索 Googleの「＋」演算子による検索が二重引用符に変更されました 2011.10.27 16:00 コメント数：[ 0 ] Tweet Googleで検索オプションの指定方法が一部変更となりました。いままで「＋」（プラス）演算子を使っていたところは、「"　"」（二重引用符）が採用されています。 ライフハッカー[日本版]Amazon売上TOP5 1.頭がいい... 続きを読む

行送り値の計算・指定 - なんでやねんDTP

2011/06/30 11 users ねんDTP InDesign 計算 Illustrator

InDesignでは以下で示すように4種類の「行送りの基準位置」が用意されており、Illustratorでも「日本語基準の行送り」あるいは「欧文基準の行送り」が設定できる。一般的にどういう指定方法が採用されているか知らないが……下の例に挙げたような段落毎に文字サイズが異なる場合は、「行送りの基準位置」の設定によって行送りの値が異なるのは当然のこと。だからこそ、行送り値とともに行送りの基準位置も指定... 続きを読む

[CSS]IE9対応、IEの各バージョンごとに異なるスタイルシートを適用する方法のまとめ | コリス

2011/05/24 437 users コリス HTML 特定 IE以外 CSS

Conditional stylesheets -条件付きコメント：スタイルシート 条件付コメントはInternet Explorerの特定のバージョンでロードさせるべきスタイルシートを簡単に指定することができます。IE以外のブラウザではこの条件付きコメントは、HTMLのコメントとして扱われます。 条件付コメントの指定方法は、下記のようになります。 続きを読む

IE9のサイトの固定をやってみた metaタグ編 | ： げことじ。

2011/04/26 23 users 固定 IE9 タスクバー metaタグ タブ

IE9の固定サイトを使ってみたので、まずはmetaタグの指定方法をまとめておく。 固定するとどうなるの？ こんな風になります。 画像はjsdo.itで作ったサンプルです。 ホームボタンのアイコン画像 戻るボタンの色 進むボタンの色 ウィンドウサイズ などをカスタマズ可能です。 サイトの固定方法 Windows7でIE9をいれていること。 固定したいサイトを開いてタブをタスクバーにドラックアンドドロ... 続きを読む

【重要】mixiアプリAPIのユーザーIDの仕様変更に関するお知らせ

2011/03/01 36 users 本件 ユーザーID API 仕様変更 mixiアプリ

mixiアプリで提供しております、全てのAPIにおいて以下の仕様変更を予定しておりますのでお知らせいたします。 本件は、全てのアプリ提供者様に影響がありますので、必ず一読していただきますよう、よろしくお願いいたします。【変更内容】 現在mixiアプリ用に提供しているAPIにおいて、ユーザーのIDの指定方法が下記の通り数字のみから、英数字（13桁）のものに変更になります。現在　　例：12345 変更... 続きを読む

[CSS]IEを含めた主要ブラウザと各スマートフォンに対応した@font-faceの指定方法 | コリス

2011/02/06 170 users コリス iOS font-face font-family

IE6, 7, 8, 9をはじめとする主要ブラウザ、iOS, Androidのスマートフォンに対応させるための@font-faceの指定方法を紹介します。各ブラウザ・スマートフォンに対応させる@font-faceの指定方法各主要ブラウザ、スマートフォンに対応させる@font-faceの記述は、下記のようになります。@font-face {font-family: 'MyFontFamily';sr... 続きを読む

【書評】 「実践Web Standards Design」が名著すぎる - IDEA*IDEA ～ 百式管理人のライフハックブログ ～

2009/01/27 345 users IDEA セレクタ 名著 書評 アマゾン

現在「実践Web Standards Design」を読破中。アマゾンでもやたら評価が高かったので気になっていたのですが、改訂版が出るというので待っていたのでした。先日無事に改訂版を購入、一気に読み込んでいます。 ↑ やっと手に入れたぞ、と。 まだ途中ではありますが、いまいちわかっていなかったDOCTYPEやらマージンの相殺やらfloatやらCSSのセレクタの指定方法だとかがすっきりとわかってかな... 続きを読む

コマンドが失敗したらプロンプトを赤くする - blog.8-p.info

2009/01/02 281 users プロンプト コマンド ARGV 8-p.info char

しばらく前から、コマンドの終了ステータスをプロンプトの色に反映させるようにしている。 終了ステータスとは C言語なら int main(int argc, char* argv[]) { ... return 0; } この return している 0 が終了ステータス。この整数値の下位 8bit がプロセスの終了時に親 (そのプロセスを起動したプロセス) にわたる。 終了ステータスの指定方法はい... 続きを読む

[CSS]日本語と英語で異なる最適なフォントサイズの指定方法 | コリス

2007/04/10 176 users font-size line-height コリス CSS

日本語・英語のサイト制作に使用しているCSSのフォントサイズの指定で、2007年用デフォルトとしているものです。 %指定を採用している理由の１つは、font-size、line-heightとともに組み合わせにより微妙に異なり、その組み合わせの最適な値を採用するためです。 日本語サイトのフォントサイズの指定 英語サイトのフォントサイズの指定 line-heightの指定 日本語サイトのフォントサイ... 続きを読む