chromeを使いこなすための便利なショートカット7つzukucode主にWEB関連の情報を技術メモとして発信しています。Chromeを、マウスを使用せずに使いこなすための便利なショートカットを7つ紹介します。他にもいろいろなショートカットがありますが、最低限以下の7つを使いこなせれば快適に操作が行なえます。タブの操作ブラウザで複数のページを快適に閲覧するにはタブの操作をキーボードのみでうまく扱う必要があります。以下がタブの基本的な操作になります。(2つまたは3つのキーを同時押しします)新しいタブを開くCtrl+t現在のタブを閉じるCtrl+wタブ移動(右のタブを表示)Ctrl+Tabタブ移動(左のタブを表示)Ctrl+Shift+Tab履歴の操作(戻る・進む)前ページと次ページを表示するときは、ブラウザの左上の矢印ボタンをクリックしますが、キーボードでも操作が可能です。前ページを表示Alt+←(Altキーと左矢印キーを同時押し)次ページを表示Alt+→(Altキーと右矢印キーを同時押し)アドレスバーにフォーカス現在表示しているページのURLを表示している部分(アドレスバー)は、URLを入力するだけでなく、検索キーワードを入力してGoogle検索を行うことができます。キーボードのみの操作でアドレスバーにフォーカスを当てることができます。10で範囲を指定して画面のスクリーンショットを撮る方法を紹介します。画面全体の指定した部分のみを切り取ってクリップボードに保存します。10でクリップボードの履歴を複数管理して貼り付ける方法を紹介します。通常コピーした文字列は、別の値をコピーすると、最初にコピーした文字列は消えてしまいます。postcssを導入するwebpackでpostcssを導入してautoprefixerなどを行います。postcss-loaderはwebpackでpostcssを行うために必要です。lessをImportしてビルドするhtmlやbodyなどに適用するベースのクラスを外部のlessファイルに実装して、スタイルをサイト全体に適用したい場合があります。外部のlessファイルをモジュールとしてImportしてwebpack...webpack-dev-serverでhttpsでのアクセスを可能にする方法webpack-dev-serverでhttpsでのアクセスを可能にする方法を紹介します。外部APIのテストや、メディアデバイスのテストなどで、開発中のlocalhostをhttpsにする必要があると...ExtractTextPluginでcssファイルを出力するwebpackのプラグインExtractTextPluginを使って、ビルドされたjsファイルからstyleの部分を抽出してcssファイルで出力します。extract-text-webpack-plu...webpackの設定を開発環境と本番環境で変更するwebpack.config.jsで本番環境でのビルドのみコードを圧縮するなどの処理を設定したい場合があります。webpackの設定を開発環境と本番環境で変更する方法を紹介します。cross-envと...webpack-dev-serverで開発サーバーを起動するwebpack-dev-serverで開発サーバーを起動します。自分で作成したモジュールをインポートするときはインポートするファイルを基準に相対パスで指定する必要があります。フォルダ構成によっては深く階層を辿らないといけないので、フォルダ構成が変わってしまうと大変...webフォントがIE11で表示されない場合の対処法FontAwesomeなどのwebフォントがなぜかIE11のみ表示されないことがありました。システム日付をYYYYMMDD形式などの文字列型に変換する当ホームページに記載されている会社名・製品名・システム名などは、各社の登録商標、もしくは商標です。