Webのメモ

NO IMAGE Webのメモ

【標準機能】WordPressでCSSを使わずに画像を横並びにする方法

画像を2カラム、3カラムにしたい場合、WordPressの標準機能で簡単にレイアウトできます。(最大9カラムまで) やり方を知って、好みのカラム表示を実現しましょう。 WordPressの画像横並びは「ギャラリーを作成」をクリック W...
NO IMAGE Webのメモ

【画像】モックアップを作れるサイトを紹介

モックアップ(mock-up)の素材がダウンロードできるサイトは、いくつかあります。 サイトによっては、オンラインの編集機能ですぐに使える形でダウンロードできるサービスもあるので、好みに合わせて便利に使いましょう。 モックアップを作れる...
NO IMAGE Webのメモ

ボックスのデザイン

背景色を半透明にする 背景色(background-color)の値として不透明を指定することができる。 ボックスに影をつける ボックスに影を表示させる(box-shadow プロパティ)では、指定する値の種類やその内容によってさ...
NO IMAGE Webのメモ

Bracketsのショートカット

■コピー&ペースト (Win:Ctrl+C、Ctrl+V/Mac:⌘+C、⌘+V) テキストを選択した状態でCtrl+Cでコピー、Ctrl+Vでペーストができます。 ■1つ前に戻る (Win:Ctrl+Z/Mac:⌘+Z) 文...
NO IMAGE Webのメモ

Bracketsのインストールと使い方

プログラミングする際にもっとも重要な仕事道具が「テキストエディタ」です。Brackets(ブラケッツ)のインストールと基本的な使い方、効率を高めるショートカットについて解説します。 テキストエディタとは HTMLやCSSのファイルは、文...
NO IMAGE Webのメモ

作業フォルダを作成する

HTMLを書き始める前に、ファイルの置き場となる「作業フォルダ」を作成します。 作業フォルダは任意の場所でかまいません。その中に「images」「css」というフォルダを作成し、imagesフォルダには必要な画像ファイルをすべて入れます。...
NO IMAGE Webのメモ

ファイルの拡張子を表示する

HTMLとCSS、どちらも文字データだけで構成されたテキストファイルですが、役割が違います。 コンピュータとユーザーが理解できるようにする必要があります。 ファイルがどのような文書(種類や形式)なのか 判別に使用するのが、ファイル...
NO IMAGE Webのメモ

ウェブページにソースコードを表示する方法3選

ウェブページでは、ソースを張りつけてもそのまま表示することはできません。 ソースを公開する方法を3つ紹介します。 海外サイト「Code Pen」 有料プランもありますが、無料で使える機能なのでFREEで登録しましょう。 ...