うぇぶごと

ぽんこつwebデザイナーのスキルのメモ

コーディング

cssで作る背景パターンをまとめてみた

コーディングの際、背景はどのようにしていますか? ストライプやグラデーション、ドットなど様々な背景があり、多くの方が画像で切り抜いて背景画像として設定していると思います。 しかし、更新速度を考えると、なるべくなら画像に頼らず、cssで設定したほ…

複数行でも3点リーダーを利用してテキストを省略する方法をまとめてみた

今回は長い文章を省略して表示するときの「…」についてまとめます。 JSを使う方法もありますが、今回はcssのみでの実装について説明したいと思います。cssのみだと1行の時しか適用されないと思われがちですが、そんなことはありません。今回は複数行でもし…

JSで作る追従メニューの実装方法をまとめてみた

今回は追従メニューについてまとめます。 追従メニューはiPadやスマホなど、様々なデバイスでのサイト閲覧可能になった今、とても注目されています。 追従メニューってなに?

ベンダープレフィックスについてまとめてみた

ベンダープレフィックスについてまとめました そもそもベンダープレフィックスとはなにか・・・ ベンダープレフィックスは、css3を使用する際に必要となり、プロパティの前につけるキーワード(識別子)みたいなものです。 このベンダープレフィックスにより…

様々なcssの横並びについてまとめてみた

様々なcssの横並びについてまとめてみた。 横並びにするために使うcssはたくさんあります。今回は横並びのcssについてまとめようと思います。

ブロック要素とインライン要素についてまとめてみた

HTMLの要素にはブロック要素とインライン要素があり、全ての要素はこの2つに分類されます。 今回は、このブロック要素とインライン要素について説明したいと思います。

HTMLとcssについてまとめてみた

HTMLとは? HTMLはHyper Text Markup Languageの略です。 HTMLはwebページを作成するために使用される使用されるマークアップの言語です。(※マークアップ・・・しるしやタグをつけること) マークアップにより、一つ一つのテキストに意味をもたせ、文章のど…

JSを使ったタブメニューと、cssのみで実装したタブメニューの実装方法をまとめてみた

今回はタブメニューについてまとめました。 タブメニューはページを変えることなく、別画面に移動できるため、ユーザーにとっても使いやすく、そして、見やすい画面構成となります。 ただ、タブの数が多くなってしまうと、押しにくく、見辛い画面となってし…

JSを使ったアコーディオンメニューと、cssのみで実装したアコーディオンメニューの実装方法をまとめてみた

今回はアコーディオンメニューについてまとめます。 スマホサイトが増えてからよく見られる様になりましたアコーディオンメニューですが、実装は主にの2通りあります。 【1:cssのみでの実装】 【2:jsも使用した実装】 まずはコードを比べてみましょう。