コーディング 【li・pタグ】CSSで2行目以降をインデント（字下げ）する簡単な方法
箇条書きや長い文章を、リストタグやpタグ等で囲ってマークアップする場合、「・」や「※」といった記号や数字を文の頭につけることがありますよね。そんな時、2行目以降の開始位置を一字下げたい場合があります。しかし、スペースを入れたりして位置調整を...
moga
コーディング 
コーディング flexboxで上下左右中央揃えをするやり方
こういうのやりたいとき実際にコード書いてみる。 真ん中.flexbox-center { display: flex; /* 子要素をflexboxで揃える */ flex-direction: column; /* 子要素をflexbox...
コーディング 【CSSアニメーション】コピペでできる。CSSでボタンを光らせる方法
光るボタンよくサイトで使われています。難しいと思ってませんか？実は簡単に実装できるんです。コピペでいけるソースコードをまとめましたので、よかったらご覧ください。光るボタンaタグにshineとういうクラスを追加ください。■CSSa.test ...
コーディング Photoshopのうざいやつ（字形パネル）を消す方法
Adobe Photoshopで文字選択をした時に出てくるあいつ...すごく邪魔ですよね。無駄に現れて作業効率も落ちるしモチベーションも落ちるし、もう大変でした。実は邪魔な「字形パネル」は消すことができるんです。そもそも何のツールなのか？実...
コーディング 【Sass（SCSS）】Koalaの基本的な使い方をやさしく解説【コーディング効率化】
CSSコーディングを効率化するためのツールに「Sass（SCSS）」がありますよね。でも、普通に書くだけでは使えず変換作業が必要です。※変換作業→コンパイルといいます。コンパイルするためには通常、黒い画面（ターミナル）と呼ばれるソフトを起動...
コーディング 【CSS】要素を中央に配置する方法（上下・中央）
コーディングをしていく中で、テキストや画像を中央に配置するデザインと、なにかしらの要素を中央に配置することがよくあります。でもコーディングを始めたばかりだと、どのようにcssを書けばいいのか迷うこともあります。この記事は以下のような人の役に...
コーディング 【初心者必見】まずはこれだけ！デベロッパーツールの使い方【chrome】
web制作に欠かせないのが、GoogleChromeのデベロッパーツール（開発者ツール）。CSSやJavaScriptが上手く反映されないときに使ったり、他のサイトのソースコードを覗いたり、使い方はさまざまです。最初は少し難しく思うかもしれ...
コーディング 【jQuery】手軽に使えるスライダープラグイン3選
スクリプトがわかるようになれば、一から作ることはできる「スライダー」。でも、ラクしたいですよね？私もできることならラクして作業を進めたいです。今回は、よく使われているスライダープラグインのご紹介です。この記事は以下のような人の役に立つように...
コーディング 【コーディング】今さら聞けない！レスポンシブデザインの対応方法
皆さん、レスポンシブwebデザインに対応したコーディング、できますか？ちょっと前まではやりますか？とお客さんに確認をとって対応していましたが、レスポンシブコーディングは今ではあたりまえになっています。でもコーディングを始めたばかりだと、レス...
ディレクション 初心者もこれでバッチリ！ワイヤーフレームの作り方
webサイト（ホームページ）の設計図となる「ワイヤーフレーム」。webサイトを制作する際には、ワイヤーフレームの制作が欠かせません。それは、家を建てるとき、設計図もなしにいきなり木を切ったりしないのと同じです。この記事は以下のような人の役に...