【本日】誠に勝手ながら、全社員研修のため、2017年4月20日(木)の13:00以降はお電話によるサポート受付を休止させていただきます。

ECサイト構築クラウド型プラットフォーム

【本日】誠に勝手ながら、全社員研修のため、2017年4月20日(木)の13:00以降はお電話によるサポート受付を休止させていただきます。

モバイルファーストマーケティングラボ

WEBデザイン

1/2ページ
  • 2019.10.18

【jQuery&CSS】レスポンシブなハンバーガーメニューを作成する

昨今、スマホ対応サイトではハンバーガーメニューをよく見かけます。ハンバーガーメニューとは三本線でメニューを開閉することができるナビゲーションメニューのことです。 図1 ハンバーガーメニューの使用例 図1の赤枠で囲んだところがハンバーガーメニュー部分です。 今回はそんなハンバーガーメニューの作成方法をcssとjQueryを用いて解説していきます。さらに、レスポンシブなハンバーガーメニューの実装例を紹 […]

  • 2019.08.30

html&cssを用いて見やすいテーブルを作成する

吉永です。 普段サイトを見ていると、テーブルを使った説明箇所をみることがあると思います。例えばよくテーブルが使用される部分としては、会社概要や料金プランなどがあります。 図1 テーブルの使用例 テーブルはいくつかの要素を比較したり、読者にコンパクトに情報を伝えることができるのでとても重宝されます。今回はサイトでよく見られるテーブルがどのようなHTML&CSSで記述されているのか解説していきます。

  • 2019.07.29

cssのdisplayプロパティを活用してhtmlの引き出しを増やす

今回はcssのdisplayプロパティについて解説していきます。 htmlタグの表示のされ方や高さ・幅の設定は予めhtmlタグごとに決まってます。しかし、これらの設定を変更し、htmlタグの使う範囲を拡張したい時があると思います。 このような場合に、htmlタグのinline要素やblock要素を変更し、適用範囲を変更できるcssがdisplayプロパティです。

  • 2019.06.13

CSSの擬似クラスを使いこなそう〜nth-childとnth-of-typeの違いとは

こんにちは。開発部の濵口です。 もうそろそろ梅雨入りですね。いかがお過ごしでしょうか。 みなさんCSSの擬似クラスはご存知でしょうか?擬似クラスを使いこなすと柔軟にセレクタを指定することができるため、Webページの装飾の幅が広がります。 今回は数ある擬似クラスの中でも似通っていて混乱しがちな、nth-childとnth-of-typeの違いについて解説していきます!

  • 2019.05.28

htmlのdivタグにcssを反映させて使いこなそう

吉永です。もう暑くなってきましたね。 今回はhtmlのタグの中でも汎用性の高いdivタグについて取り上げます。このdivタグはcssとも相性がよく、たいていclassやidを付与して使います。 ただ、あまりの汎用性の高さにどう使えばいいのかわからない人が多くいると思います。また逆に、無駄に使いすぎている人もいるのではないでしょうか? そこで、この記事ではdivタグの効果的な使い方を再確認しつつ、c […]

  • 2019.04.24

CSSのmarginとpaddingで余白を設定しよう

吉永です。今回第一回目の記事になります。 CSSでwebページを作成するにあたり、ボックス関連の分野は難しいと感じる方が多いと思います。それは、paddingとmarginの違いが曖昧なままだからだと考えられます。 そこで、この記事ではpaddingとmarginの違いを明確にしながら、実際の現場で活かせるように解説します。

  • 2016.10.06

【jQuery】切替可能なレスポンシブ対応のタブメニューを作ってみる

タブメニューを作ってみよう みなさんこんにちは。開発部の本田です。 今回は、jQueryを使って簡単に切替できるレスポンシブ対応のタブメニューを実装していきたいと思います。 最近では様々な用途のサイトで導入されており、ECサイトで利用されることも多々あります。 オシャレで見やすいサイトを実現できるので是非試してみてください。

  • 2016.06.02

【レスポンシブ対応】スマホで使えるハンバーガーメニューを実装してみた

ECサイトの流入の7割がスマホからの流入となった今、スマホでのUI/UXは非常に重要です。 今回はレスポンシブで対応しスマホでのUIを大きく上昇させるハンバーガーメニューの実装方法をご紹介します。スマホのような小さい画面でも操作しやすいメニューを作成することができます。

  • 2014.06.13

レスポンシブサイトでパララックス効果をCSSだけで実装する方法

最近、パララックス効果(視差効果)を取り入れたサイトを目にするケースが増えてきています。ECサイトの場合、商品ページにパララックス効果を取り入れる必要性はそれほど高く無いかもしれません。 しかしLP(ランディングページ)の見せ方として、パララックスさせることで工夫次第で、人を惹きつけるページを作成することができます。 パララックス効果を持たせるには、javascriptによる実装がよく使われていま […]

機能のご確認はお気軽にお問合せ、もしくは2週間無料お試し利用で。
aishipRの無料体験、お問合わせはお気軽に。説明会・資料請求も受付中。
0120-173-163
0120-173-163
無料体験
  • 無料体験
  • 問合せ
  • 説明会
  • 資料請求
  • 問合せ
  • 説明会
  • 資料請求
+