びぼうろくnote

サイト制作などの備忘録

2020-10-15から1日間の記事一覧

CSSだけで点線の吹き出しを作る方法

<div class="balloon"> <p>ここにテキストが入ります。</p></div> .balloon { position: relative; max-width: 400px; padding: 20px 8px; text-align: center; background-color: #fff; text-align: center; color: #000; border: 2px dashed #f00; border-radius: 15px; margin: 0 auto;} .ba…

CSS で矢印を作る方法

棒付き矢印を作る方法 .stickarrow { width: 40px; height: 8px; border-bottom: 1px solid #000; border-right: 1px solid #000; transform: skew(45deg);} リンク記事には、>・▶ のコードも書いてある hirashimatakumi.com #css

VS Codeで選択範囲をHTMLタグで囲むショートカットキーを設定する

①ファイル⇒ユーザー設定⇒キーボードショートカット (Ctrl + K ⇒ Ctrl + S) ②検索バーに emmet wrap と入力 ③Emmet: Wrap with Abbreviation を選択⇒キーバインド設定 (私は、Shift + Alt +W にした) qiita.com ショートカットキーを使うときは、 タグで…

VSCode拡張機能 コード整形(Beautify)

Shift + Alt + F もしくは 右クリック⇒ドキュメントのフォーマット gimmicklog.com Beautify右クリック「ドキュメントのフォーマット」(日本語化している場合)を選択すると、インデントをキレイに整形してくれます。

IllustratorでWeb用にスライスするショートカット

illustratorで、 ●オブジェクトを元にスライスを行ってくれるショートカット[alt]+[o] → [s] → [s] ●スライスの命名ウィンドウを出すショートカット[alt]+[o] → [s] → [o] ※編集⇒キーボードショートカット⇒メニューコマンドから、オリジナルキーの設定もでき…

flexboxチートシート

flexシートはこちらが優秀 www.webcreatorbox.com #css

last-childの書き方

ずっとSassで書いてたから、cssのlast-childの書き方いつもド忘れしてまう; ○○(タグ・クラス名) : last-child { } developer.mozilla.org #css

Illustrator アセットの書き出しでWeb用画像を作る

llustrator、バージョンCCから?「アセットの書き出し」でWeb用画像が作れるみたい(゜-゜) www.pc-koubou.jp