CSSにおけるマージンの相殺を徹底解説
CSSにおけるマージンの相殺は何か、どういう条件で起こり、どのように相殺されるのか、また相殺を回避する方法などを紹介します。 下と上のマージンの相殺は単純ですが、マージン値が異なる場合、入れ子の場合、複数の場合、同方向の場合、負のマージンの場合、パディングやボーダーがある場合など、実装に伴うさまざまな例を解説します。 この記事を読むと、マージンの相殺がどのように機能するかがよく分かるようになり、悩むことはなくなります。 The Rules of Margin Collapse by Josh W. Comeau 下記は各ポイントを意訳したものです。 デモは元記事ではインタラクティブですが、Gifアニメにしています。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに 垂直マージンのみが相殺される 隣接する要素のみが相殺される より大きなマージンが勝つ 入れ子は
【GAS】自動で議事録を作成しSlackに定型の情報を通知する方法
まいどです。テクニカルディレクターのやなさんです。 さて、Web制作やサービス開発の現場ではもちろんのこと、仕事を進めるなかで「定例のミーティング」って絶対ありますよね？ ミーティングを行うということは、みなさん議事録やアジェンダを作成しているかと思います。 その週次・月次ミーティング用の議事録やアジェンダを準備する際…… 該当のフォルダを開いて ファイルをコピーして アジェンダを更新して メンバーへ通知する っていう作業を毎回毎回やっていたりしませんか？？ こういう作業って、単純に手間ですし、作業中のタスクを止めることで集中が切れてしまうことをとても非効率に感じてました。 ということで、自動で作成されるようにしてみました（一定の部分まで）。 LIGでは、ドキュメントはG Suite、コミュニケーションツールはSlackを利用しています。 今回、上記1・2・4が自動となるように、GAS（G
Vue.js、Nuxt JSを学習するときにやったこと
2021年7月11日 JavaScript, Nuxt JS, Vue.js 以前「WebデザイナーのためのVue.js事始め」という記事でVue.jsについて触れたのですが、それから今まで、どんな手順で勉強してきたのかを紹介してみます。途中ReactやGatsbyを取り入れたりもしていたのですが、結局 .vueファイルでの単一ファイルコンポーネントが楽だなーと思い、今はVue.jsに全振り中です。これから勉強してみたい方の参考になれば幸いです。 ↑私が10年以上利用している会計ソフト！ 1. Vue.js公式Webサイトを確認 まずはVue.jsの公式Webサイトを確認。日本語にも対応しています。ここで基本的な使い方、文法、何ができるのかなどをざっくり学習しました。 サンプルコードがある箇所は実際にCodePenを使ってコードを記述し、動作確認します。公式は今後何度も繰り返しチェックする
)
SwiftBar - メニューバーを強力にカスタマイズ
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました macOSのメニューバーは色々なソフトウェアの常駐に使われます。そのため、情報がたくさん並んで溢れてしまっている人も多いでしょう。とはいえディスプレイの解像度が上がっているので、表示スペースは拡大しています。 今回紹介するSwiftBarはそんなメニューバーを占拠できるレベルでカスタマイズできるソフトウェアです。 SwiftBarの使い方 起動しました。SwiftBar自身が常駐しています。 プラグインは多彩に用意されています。 プラグインをインストールしました。Xcodeのバージョンを表示します。 さらに時刻とカレンダーを表示するプラグインも。 初期設定です。 おそらくメニューバーに情報が並んでしまうのを防止するために通知センターやウィジェットが作られたのですが、ワンクリックする
商用OK！今どきのおしゃれイラスト素材を無料ダウンロードできる優良サイト19個まとめ
この記事では、絵を描くのが苦手という非デザイナーのひとにも役立つ、商用利用可能な無料イラスト素材を公開しているサイトをまとめてご紹介します。 最近のウェブサイトのランディングページやスマホアプリなどでよく見かける、キャラクターをつかったイラストスタイルに対応した、比較的新しい素材ライブラリが中心に揃います。 日本生まれのイラスト素材をダウンロードしたいときは、以下の記事でまとめているので、一緒に確認してみてはいかがでしょう。 全て無料、本当は教えたくないフリーイラスト素材サイト83個まとめ【商用OK】 商用OK！今どきのおしゃれイラスト素材を無料ダウンロードできる優良サイトまとめ Scale 高品質なイラストが毎日アップデートされており、カラーピッカーでお好みの配色に変更することも可能。クレジット表記不要で、商用利用にもばっちり対応しています。 DrawKit 毎週アップデートが行われてい
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
