先日ラジオボタンのカスタムについての記事をUPしました。 フォームのラジオボタンをCSSカスタムで可愛くする
|
https://twitter.com/chiiweb_ |
---|---|
|
https://www.instagram.com/chiiweb_/ |
先日ラジオボタンのカスタムについての記事をUPしました。 フォームのラジオボタンをCSSカスタムで可愛くする
お問い合わせフォームのラジオボタンをカスタムしたい時のCSSコードを紹介しています。デフォルトのラジオボタンを見えない状態にし、新たに選択前、選択後のボタンを作成します。デザインに合わせてボタンを変更したい時の参考にご利用ください。HTML、CSSコードはコピーしていただいてOKです。
苦しい 自分では何らかの病気だと思っているのですが、普通のTシャツが着られません。 首の上にあたるような服が着
【リニューアル時に注意!】WordPressの自動更新で旧サイトに戻った原因は?
今回のテーマはご相談いただいた内容です。 WordPressに自動で更新が入って、旧サイトに戻ってしまう? ま
ちいさなwebデザイン教室は、webデザイン初心者さんから、既に活躍されている方まで幅広く集まるオンラインweb教室&webデザイナーの為のコミュニティです。「習い事」のような敷居の低いWebデザインスクールも兼ねています。
CanvaがPhotoshopよりも便利だと感じるポイントを紹介しています。良い点、悪い点はどちらにもありますが、デザインをするときは両方を使い分けるのがベストだと思っています。細かい部分やこだわりたい部分をPhotoshopで作り、トリミング等をCanvaでサクッと作るとかかなり便利だと思います。
“世の中のデザインは男性的なものが多い”という切り口で始めたがただのグチになった
こんにちは。 いつもブログを読んでいただきありがとうございます 今日はタイトルについての個人的な見解を述べたい
フリーランスWEBデザイナー・イラストレーターMAHOさんにお仕事がどんな感じか聞いてみた
ちいウェブログ特別版インタビュー 札幌出身で現在は名古屋に住んでおります。大学卒業後に5年間ANAでCAとして
Instagram投稿用Canvaテンプレート販売のお知らせ
女性向け投稿を作りたい方用のCanvaテンプレートを作成しました。 Fancy Orange 13枚セット、Natural Pink24枚セットです。ぜひご利用くださいませ♩Canvaを利用して文字や画像をカスタマイズしてご利用いただけます。
デザインの参考に、背景を変えるだけでデザインに与える印象が異なるという、参考画像を用意しました。どんな印象を受けるかご覧ください♩比較デザイン画像を複数置いてます。Webデザインの参考として使える背景比較画像まとめです。リクエストはコメントにお願いします。
明けましておめでとうございます。 今年もよろしくお願い申し上げます。 あっという間に2024年になりました。
デザインにオススメの本 レタースペーシング タイポグラフィにおける文字間調整の考え方 これ素敵な本だと思います
貴様がここで働くメリットは承知した・だが私が貴様を雇用するメリットは?
今ヒロアカアニメ見ています。 タイトルは、S4の66話で出てくるセリフです。 インターンとして働きたい主人公が
静的サイトにお問い合わせフォームをつけたい場合、いくつか選択肢があります。 今回は、その選択肢の1つである、"
ハンバーガーメニュー”閉じるボタン”をクリックで追加エフェクト
こちらの記事で、基本のハンバーガーメニューを紹介しました。 基本のハンバーガーメニューエフェクトまとめ /me
コピーですぐに使えるハンバーガーメニューエフェクトまとめです。HTML・CSS・jQueryのコピペ用コードを紹介します。
最愛のDreamweaverがそろそろダメそうなので乗り換える
Dreamweaverがちょくちょく固まるようになってきた。 Dreamweaver民さんいかがでしょうか。
タブと別ページから”タブを開いた状態”でのリンクを実装【jQuery】
タブはシンプルにjQueryで実装できます。 さらに、別ページから特定のタブを開いた状態でのリンクを実装する方法も紹介します。 HTML・jQuery・CSSコードを紹介しています。見本(デモ)もありますので参考にご利用くださいませ。
実は30代になってやっと気付いたことが色々ありまして。 私はどうやら「音」が普通の人よりも苦手だということです
コーディングのヒントになるかもな質問集です。実際に会った質問とそれについて簡単な説明を紹介しています。
こんにちは。 何か更新した後にお客さまから 変わってませんよ〜 こんな感じでHTMLにスタイルシートを読み込み
シンプルで使える「WP-PageNavi」デザインCSSコード
プラグイン「WP-PageNavi」を使用したページネーションのデザイン用CSSコードです。 WP-PageN
ページネーションって? ページネーションというのは、アーカイブページ(一覧ページ)で表示される「ページ送り」の
WordPressの投稿や固定ページで、動画を背景にする方法を紹介しています。動画の配置方法と、コピペ可能なCSSコードです。WordPressサイトのカスタマイズにご利用ください。動画はvideoタグで配置します。注意ポイントも紹介しています。
【WordPress】テーマでフォントをGoogleフォントに変える方法
先日フォントについての記事をUPしました。 お気に入りの”手書き日本語フォント”と【フ
先にフォントの使い方を見る 先月は、Canvaクリエイターとして全くテンプレートを新規追加できませんでした。フ
WordPressの標準機能として使える「ギャラリー」をスライドショーにする方法を紹介します。 お客様がご自身
今回の構造は、2カラムです。 左、右の箱に分け、左には画像、右には見出し+テキストが入っています。 HTML
ちいさなWebデザイン教室今年のクリアファイルができたので紹介いたします。 クリアファイルは2回目の企画で、昨
ボーダーカラーをグラデーションにし、その色を変えることで、アニメーションにすることが可能です。コピペできるHTML・CSSコードを置いています。仕切りや見出しのアクセントとして使えます。コピペで簡単に実装できます。ぜひ使ってみてください。
ちいさなwebデザイン教室は、webデザイン初心者さんから、既に活躍されている方まで幅広く集まるオンラインweb教室&webデザイナーの為のコミュニティです。「習い事」のような敷居の低いWebデザインスクールも兼ねています。
スマホ、何使ってますか? 私はiPhone11 proを使っているんです。 1年程前に家族で白浜に行きました。
【WordPress】目次を自動表示するプラグイン、Table of Contents Plusを使ってみたら神でした
いや、割と最近まで、目次を自力で作っていました! このtocってプラグインくさい。 ていうか、絶対プラグインや
【WordPress】プラグインを利用して更新通知をメール配信できるようにしてみた
Twitter(X)やInstagramのストーリーズ等を利用して、更新をお知らせすることはできます。 ですが
【WordPress】背景を画面いっぱい横幅にしたい時のカスタマイズ方法
WPテーマの固定ページで制作をしている時に、途中のセクションだけ横幅100%の背景をつけたいこと、ありませんか
よく使うhtmlをまとめてみました。 マークアップの参考にしてみてください^^ Webサイトのマークアップ 一
LPをWordPressテーマの固定ページで作る時の考え方のヒント
LP制作を受注したら まず、LP制作を受注したら、どんな風に作っていくかを検討します。 WordPressのテ
【もう使った?】Photoshopベータ版AIの「生成塗りつぶし」で写り込んだ人を消しちゃう方法
Photoshopベータ版なるものがあるらしいと聞いて、早速試してみました。 AIを使って、「塗りつぶし」の機
地域タグ:大阪府
Webデザイン未経験から安定して月10万円以上稼げるようになるまでにしたこと
こんにちは。 フリーランスとしてwebデザイナーをしているまりえです。Before(お直し前) Canvaお直
上スクロールで表示、下スクロールで非表示にするフッターリンク
制作見本 上にスクロールで表示する 今回はこのように、上スクロールのみで表示させるバナーエリアを作ります。 こ
画像の切り替えを行うCSS 画像の切り替えと考えると、難しく聞こえるかもしれません。 ですが書くコードはシンプ
Youtubeサムネイルのテンプレートを作成したので貼っておきます。 Youtubeサムネイルは基本プロにしよ
【激変ッ★】無料写真素材の魅力を最大限に引き出す「Photoshop」加工
キラッ★ 流星にまたがって〜 こちらは、UnsplashのThomas Vimareさんが撮影した写真です。
“テキストを1行ごとにフェードインで表示させたい”という質問をいただいたので、アニメーションのコードを作ってみました。 [目次]1 完成イメージ2 HTML3 CSS4 使用する場合は、画面内に入 ……
この本良すぎた!「奴隷の哲学者エピクテトス 人生の授業 ――この生きづらい世の中で「よく生きる」ために」
紹介したい本はいろいろ溜まってるんですけど、どの本よりもまずオススメしたい本があったので先に紹介します Amazonで見る 奴隷の哲学者エピクテトス 人生の授業 ――この生きづらい世の中で「よく生きる」ために [目次]1 ……
コピペするだけで使えるドットパターンを紹介します。 [目次]1 HTML2 ドットパターンまとめ2.1 パターン12.2 パターン22.3 パターン32.4 パターン42.5 パターン53 どんな風に使えるか3.1 普通 ……
こんちゃです〜。 ドットを使って背景にノイズをかける方法を紹介します。 背景にノイズって? と言葉ではピンとこないと思うので、早速こちらをご覧ください 制作イメージ 例えばこんな感じで画像があったとします。 そして、ドッ ……
以前に、こちらの記事で三角形の作り方について少し触れています。 borderプロパティを利用して三角形を作成していました。 ただ、この方法だと三角形を形作るのが直感的に分かり辛く、コーディング初心者さんからは難しいとのお ……
夫がこんな感じのヘアスタイルをしています。 いつの頃からか、5歳の娘が「ハート作ってる」というようになりました。 我が家では笑いの種になっています。 確かに・・・と思いまして と、余談はここまでにして… 早速 ……
定義リストとは まずは簡単に、定義リストについて書いておきます 定義リストとは、<dl>タグを使って表すリストです。 description list = dl リストの範囲 description term = ……
BenQ MOBIUZ EX270M ゲーミングモニターを買ってみたよ〜
ではまずみなさまに謝らせてください。 この度当ブログの更新が滞ってしまい、大変ご迷惑をおかけしました。本当に本当に申し訳ございませんでした。 いや、誰も待ってへんけどな モニタを買いました! 唐突やな 今回買ったのは、「 ……
BenQ MOBIUZ EX270M ゲーミングモニターを買ってみたよ〜
ではまずみなさまに謝らせてください。 この度当ブログの更新が滞ってしまい、大変ご迷惑をおかけしました。本当に本当に申し訳ございませんでした。 いや、誰も待ってへんけどな モニタを買いました! 唐突やな 今回買ったのは、「 ……
ちいさなwebデザイン教室は、webデザイン初心者さんから、既に活躍されている方まで幅広く集まるオンラインweb教室&webデザイナーの為のコミュニティです。「習い事」のような敷居の低いWebデザインスクールも兼ねています。
ちいさなwebデザイン教室は、webデザイン初心者さんから、既に活躍されている方まで幅広く集まるオンラインweb教室&webデザイナーの為のコミュニティです。「習い事」のような敷居の低いWebデザインスクールも兼ねています。
WordPress標準カラムを横スクロールにするCSSカスタマイズ
WordPressのテーマカスタマイズを利用してサイトを作った際に、プランの一覧を表示させることがありますよね。 先日この質問がありましたのでブログでもシェアさせていただきます WordPress標準カラム 次のセクショ ……
【WordPress】FAQを追加・編集する為のSmart Custom Fieldsの使い方
完成イメージ 今回実装したいFAQのイメージです。 (画像なので動きません) よく見かけるタイプの、開閉(アコーディオン)式QandAです。 QやAをカスタムフィールドで編集可能にし、さらに、質問が増える可能性も考慮し項 ……
【WordPress】FAQを追加・編集する為のSmart Custom Fieldsの使い方
完成イメージ 今回実装したいFAQのイメージです。 (画像なので動きません) よく見かけるタイプの、開閉(アコーディオン)式QandAです。 QやAをカスタムフィールドで編集可能にし、さらに、質問が増える可能性も考慮し項 ……
Instagram投稿、ブログヘッダー、広告などに使えるビジネス用テンプレです。 全て無料ですのでぜひ一部変更してご使用ください リンクがまだのものは現在未公開ですので少々お待ちくださいませ。
ちいウェブではクリエイター紹介ページをただ今制作中です。 その前に、参加メンバーさんの紹介をこのページでさせていただきます。 西谷慶子さん リンクまとめページ 最初知り合いしか入っていなかった教室でしたが、初めて外部の方 ……
【1000人までにすることって?】11万人フォロワーアカウントを運営するえれなさんにInstagram運用についてお話していただきました
こんにちは! 今月のちいウェブオンライン会は、特別版でした。 えれなさんがインスタ運用代行をしているアカウントが、なんと11万人フォロワーさんがいるということで、驚きのあまりお願いした企画回でした。 インスタを更新してい ……
【1000人までにすることって?】11万人フォロワーアカウントを運営するえれなさんにInstagram運用についてお話していただきました
こんにちは! 今月のちいウェブオンライン会は、特別版でした。 えれなさんがインスタ運用代行をしているアカウントが、なんと11万人フォロワーさんがいるということで、驚きのあまりお願いした企画回でした。 インスタを更新してい ……
今日はお役立ちコードの投稿ではなく、最近考えていることを文章として残したいと思います。 最近、英会話の教室に通っています。 月に2回のレッスンで、マンツーマンではなく、もう1名授業を受ける方と2名で授業を受けています。 ……
↑hoverしてね ゆらゆらウェーブアニメーションをCSSのみで作ります。 htmlでは波を入れる箱を用意します。 CSSで、箱にスタイルをあてます。 波は、疑似要素::beforeを使って作成します。 position ……
0から100へ【jQuery】を利用したカウントアニメーション
今回はこれを作ります ↑リロード(更新)してみてください 0から100まで数字を動かすアニメーションです。 これは、jQueryを使っています。 jQueryを読み込んだ状態で記述してくださいね まずはhtmlです。 C ……
こんな風に桜の花びらを散らすアニメーションです。 コピーして使ってください htmlはこちらです。 今回はこんな感じでimgにしてみました。 用意したのは桜の花びら4種類です。 この時点でもう可愛いですよね で、これを散 ……
【CSS】マウスオンでテキストがネオンのように光るアニメーション
LINK 今日はこれを作っていきます。 hoverしてみてね htmlはリンクを貼るだけです。 CSSもめっちゃ簡単 hoverしたタイミングで、text-shadowを使ってネオンっぽくしています。 HAPPY .ne ……
自分で考えた【hoverアニメーション】で差別化♡シンプルなのにこだわってる風CSS
このhoverアニメを作っていきます。 hoverしてみてね hoverアニメーションの作り方 これを作るのに必要なパーツは以下の2つです。 円 アイコン この2つをhtmlでマークアップし、CSSで変化をつけてアニメー ……
次のようなデザインをコーディングする場合あなたならどうしますか? CONCEPT beforeを使って擬似要素を作り、ボーダーにする方法です。 ではコードを見ていきましょう。 h2はセンター配置しておきます。 「/」をp ……
【CSS】やってみたくなるSNSシェアボタンのアニメーション
↓こんなボタンを作っていくよ マウスホバーで隠れているアイコンたちが出現するボタンです。 htmlの考え方 これを作るのに必要なパーツは、角丸長方形とアイコンたちですよね。 アイコンの上に角丸長方形が乗っていて、マウスオ ……
コミュニティに参加するほどではないけれど、相談したいことがあったり、質問したいことがある方の為に、zoomを利用した1時間の単発レッスンをご用意しています。 5,500円/1時間 ご注意事項 こちらのレッスンは以下の時間 ……
コミュニティに参加するほどではないけれど、相談したいことがあったり、質問したいことがある方の為に、zoomを利用した1時間の単発レッスンをご用意しています。 5,500円/1時間 ご注意事項 こちらのレッスンは以下の時間 ……
CSSでよく使う単位についてまとめます。 絶対的なサイズの単位 px Pixels ピクセル デザインツールでフォントサイズを確認し、16pxなら、font-size: 16px;と指定可能です。 相対的なサイズの単位 ……
こんにちは。 WebクリエイターをしているMarieです。 今年、女性起業家さん向けの新サービスを提供予定の為、そのモニターさまを募集いたします。 概要 ご質問、ご相談はmmDesignホームページお問合せよりお送りくだ ……
かなり放置していたInstagramの投稿を再開しました。 そこで色々とメモしておきたいことが出てきたので記事にまとめてみます。 ただ、こちらの記事は有料とさせていただきます。 前回のInstagram考察記事(有料)は ……
【CSS】Instagram風フレームコーディングはどうやる?
写真を配置するときに、フレームどうしようかな?とデザインで悩むことってありませんか? そんな時の一案として、Instagram風のフレームはどうでしょうか 外枠にボックスシャドウを入れることで、抜け感を出すことができます ……
最近は無料で使用できるフォントがとても充実していて、Webフォントとして使用できるものもたくさんあり、本当にありがたいですよね。 そんな中、欲しいなーと思わせたフォントたちを紹介します。 フリーランスになってから購入しま ……
独学でデザインの勉強をすると、中々デザインのフィードバックを受ける機会がないかと思います。 そんな時はちいさなWebデザイン教室へ デザインの添削は回数制限なく受け付けております。 先日メンバーさんのデザイン添削をしまし ……
昨年12月の半ばにCanvaクリエイターになりました。 少しずつ隙間時間にテンプレートを作成するのがもはや趣味となり、ストックができてきたのでこの場で紹介させてください 画像clickでテンプレートリンクに飛びますので、 ……
要素の余白paddingのつけ方【コーディング初心者さんへ】
paddingとmarginのつけ方で1つポイントがあります。 初心者さん向けの内容です 余白は親要素に 以下はよくあるレイアウトです。 このレイアウトあなたならどういう風にコーディングしますか? こういう風に、左と右に ……
LPのファーストビューデザイン、メンバーまほさんの作品を紹介
webデザインコミュニティちいウェブでは、月に1度オンラインでのワークショップを開催しています。 毎回テーマを決め、参加者の方とお話しながら制作し、終了後に作ったものを見せ合うという楽しい会でございます 昨年の夏頃に、「 ……
2022年1月頃に、1つのテーマでLPデザインを作るという企画をしていました。 その時にちいウェブメンバーさんが実際に作られた作品をお見せします^^ こちらで作成したデザインは、セールス目的のランディングページではなく、 ……
なんとこのちいさなwebデザイン教室は今年で3期目。 メンバーさんに企画の参加を募り、それぞれ「2022年やりたいこと」をテーマに出してもらったデザインをまとめてクリアファイルにするという企画です。 完成したクリアファイ ……
お久しぶりです。 あっという間にもう年末が来るので焦っています。 明日から息子が冬休みになるので、ゆっくりブログを書く時間が取れなくなるかもしれないので、少し早いですが2022年の振り返りをしてみようと思います。 だいた ……
Canvaクリエイターになりました これまでデザインのメインはAdobeのPhotoshopで行ってきましたが、この度Canvaクリエイターになりましたので、Canvaを触り始めました Canvaプロフィールページはこち ……
縁取りの文字をつくるよ! 今日はこんな縁取り文字をcssで作ってみます。 縁取り文字を作るプロパティ text-stroke text-strokeを使います。 今年もあと少し text-strokeは縁取り文字を作れま ……
twitterの代わりにWordPressを使って今の気持ちを投稿してみる
twitterは苦手だけどたまに呟きたい 私は、会話の中でSNSの話題が出たら都度言っているのですが、twitterが苦手なんです。 と言っても、twitterに限らずSNS全般が苦手で、Webデザインコミュニティの運営 ……
はじめてコーディング ①そもそもコーディングって何? ②コーディングに必要なものnow コーディングに必要なものは、コーディングに使うエディタとデザインデータです。 コーディングエディタ 前回の記事、①そもそもコーディン ……
コーディング入門に役立つような投稿をスタートします コーディングが本当に”初めての方“が、コーディングができるようになるまでの手助けになるような記事を投稿したいです なぜならば、このブログにアクセ ……
新規サイト作成時ブログはアメブロとWordPressどちらが良い?
先日ちいウェブ内でいただいた質問ですが、個人的に色々考えるところがあったので敢えてテーマにして書いてみることにしました。 今回の質問内容 今回の質問内容を整理しますと、 このような感じです。 私はアメブロを使ったことがな ……
SVGって何が便利なの?どうやって作る?では、ベクターデータをSVGで書き出して使用する方法を見てきました。 今回は、SVGを使って簡単な形を作ってみるということをしたいと思います。 今回作るのは、円、三角形、星です。 ……
前回の記事、SVGアニメーションって何?どうやって使うの?では、SVGのシンプルなアニメーションを紹介しました。 SVGは、XMLベースの画像形式なので、cssを使えます。 カラーの変更をする必要がある画像等にはとても便 ……
↓こんなアニメーションを作ってみます SVGアニメーションって何? SVGアニメーションは、SVGで書き出したデータをcssのアニメーションを使って動かします。 “SVGでの書き出し”は、慣れてい ……
実際のサイトで使われているtableデザイン例+コピペ用【css】
実際のサイトで使われているテーブルをまとめてみます♫ tableは、会社概要や、クリニックの診療時間などに使われていることが多いですよね。 デザイン時の参考にしてみてくださいね^^ 横線のみのシンプルな表 募集職種 地域 ……
今日は、テキストを右から左に動かすcssアニメーションを見てみませう。 ちょっとしたお知らせなどを流す時に使ったりされていますよね^^ cssのアニメーションを使う テキストを流していますよー٩( ᐛ )و xxxx.x ……
今日は、テキストを右から左に動かすcssアニメーションを見てみませう。 ちょっとしたお知らせなどを流す時に使ったりされていますよね^^ cssのアニメーションを使う テキストを流していますよー٩( ᐛ )و xxxx.x ……
【CSS】transitionを利用して背景を徐々に表示させる
transitionとanimationの違いtransitionの使い方transitionを使ったhoverアニメtransitionは待ち時間も設定できる画面に要素が入ったら背景を表示させる要素が画面内に入ったらc ……
【css】object-view-box を使って画像の好きな場所をトリミングする
画像のトリミングは、background-imageを使ったり、object-fitを使ったり、親につけるoverflow:hiddenを利用したりといくつか方法があります。 今回は、object-view-boxという ……
cssで点滅するアニメーション点滅=不透明度を変更する 星をテーマにするので、この記事の背景を暗くしてみました。 暗い背景に、白いものがあると目立ちますね 星画像を点滅させると、キラキラしているっぽく見えます。 cssで ……
さてさて!本題に入ります。 インライン要素の中央配置インライン要素を左右中央にするインライン要素を左右中央にし、高さも中央にする1.paddingを使う2.vertical-alignを使う3.display: flex ……
ヒヤリングについての不安ヒヤリングシートについてヒヤリング、実際どんな風にしているかヒヤリングシートをどう作ったら良いか分からない ヒヤリングについての不安 フリーランスになったばかりのデザイナーさんの中には、ヒヤリング ……
「ブログリーダー」を活用して、まりえさんをフォローしませんか?
先日ラジオボタンのカスタムについての記事をUPしました。 フォームのラジオボタンをCSSカスタムで可愛くする
お問い合わせフォームのラジオボタンをカスタムしたい時のCSSコードを紹介しています。デフォルトのラジオボタンを見えない状態にし、新たに選択前、選択後のボタンを作成します。デザインに合わせてボタンを変更したい時の参考にご利用ください。HTML、CSSコードはコピーしていただいてOKです。
苦しい 自分では何らかの病気だと思っているのですが、普通のTシャツが着られません。 首の上にあたるような服が着
今回のテーマはご相談いただいた内容です。 WordPressに自動で更新が入って、旧サイトに戻ってしまう? ま
ちいさなwebデザイン教室は、webデザイン初心者さんから、既に活躍されている方まで幅広く集まるオンラインweb教室&webデザイナーの為のコミュニティです。「習い事」のような敷居の低いWebデザインスクールも兼ねています。
CanvaがPhotoshopよりも便利だと感じるポイントを紹介しています。良い点、悪い点はどちらにもありますが、デザインをするときは両方を使い分けるのがベストだと思っています。細かい部分やこだわりたい部分をPhotoshopで作り、トリミング等をCanvaでサクッと作るとかかなり便利だと思います。
こんにちは。 いつもブログを読んでいただきありがとうございます 今日はタイトルについての個人的な見解を述べたい
ちいウェブログ特別版インタビュー 札幌出身で現在は名古屋に住んでおります。大学卒業後に5年間ANAでCAとして
女性向け投稿を作りたい方用のCanvaテンプレートを作成しました。 Fancy Orange 13枚セット、Natural Pink24枚セットです。ぜひご利用くださいませ♩Canvaを利用して文字や画像をカスタマイズしてご利用いただけます。
デザインの参考に、背景を変えるだけでデザインに与える印象が異なるという、参考画像を用意しました。どんな印象を受けるかご覧ください♩比較デザイン画像を複数置いてます。Webデザインの参考として使える背景比較画像まとめです。リクエストはコメントにお願いします。
明けましておめでとうございます。 今年もよろしくお願い申し上げます。 あっという間に2024年になりました。
デザインにオススメの本 レタースペーシング タイポグラフィにおける文字間調整の考え方 これ素敵な本だと思います
今ヒロアカアニメ見ています。 タイトルは、S4の66話で出てくるセリフです。 インターンとして働きたい主人公が
静的サイトにお問い合わせフォームをつけたい場合、いくつか選択肢があります。 今回は、その選択肢の1つである、"
こちらの記事で、基本のハンバーガーメニューを紹介しました。 基本のハンバーガーメニューエフェクトまとめ /me
コピーですぐに使えるハンバーガーメニューエフェクトまとめです。HTML・CSS・jQueryのコピペ用コードを紹介します。
Dreamweaverがちょくちょく固まるようになってきた。 Dreamweaver民さんいかがでしょうか。
タブはシンプルにjQueryで実装できます。 さらに、別ページから特定のタブを開いた状態でのリンクを実装する方法も紹介します。 HTML・jQuery・CSSコードを紹介しています。見本(デモ)もありますので参考にご利用くださいませ。
実は30代になってやっと気付いたことが色々ありまして。 私はどうやら「音」が普通の人よりも苦手だということです
コーディングのヒントになるかもな質問集です。実際に会った質問とそれについて簡単な説明を紹介しています。
完成イメージ 今回実装したいFAQのイメージです。 (画像なので動きません) よく見かけるタイプの、開閉(アコーディオン)式QandAです。 QやAをカスタムフィールドで編集可能にし、さらに、質問が増える可能性も考慮し項 ……
完成イメージ 今回実装したいFAQのイメージです。 (画像なので動きません) よく見かけるタイプの、開閉(アコーディオン)式QandAです。 QやAをカスタムフィールドで編集可能にし、さらに、質問が増える可能性も考慮し項 ……
Instagram投稿、ブログヘッダー、広告などに使えるビジネス用テンプレです。 全て無料ですのでぜひ一部変更してご使用ください リンクがまだのものは現在未公開ですので少々お待ちくださいませ。
ちいウェブではクリエイター紹介ページをただ今制作中です。 その前に、参加メンバーさんの紹介をこのページでさせていただきます。 西谷慶子さん リンクまとめページ 最初知り合いしか入っていなかった教室でしたが、初めて外部の方 ……
こんにちは! 今月のちいウェブオンライン会は、特別版でした。 えれなさんがインスタ運用代行をしているアカウントが、なんと11万人フォロワーさんがいるということで、驚きのあまりお願いした企画回でした。 インスタを更新してい ……
こんにちは! 今月のちいウェブオンライン会は、特別版でした。 えれなさんがインスタ運用代行をしているアカウントが、なんと11万人フォロワーさんがいるということで、驚きのあまりお願いした企画回でした。 インスタを更新してい ……
今日はお役立ちコードの投稿ではなく、最近考えていることを文章として残したいと思います。 最近、英会話の教室に通っています。 月に2回のレッスンで、マンツーマンではなく、もう1名授業を受ける方と2名で授業を受けています。 ……
↑hoverしてね ゆらゆらウェーブアニメーションをCSSのみで作ります。 htmlでは波を入れる箱を用意します。 CSSで、箱にスタイルをあてます。 波は、疑似要素::beforeを使って作成します。 position ……
今回はこれを作ります ↑リロード(更新)してみてください 0から100まで数字を動かすアニメーションです。 これは、jQueryを使っています。 jQueryを読み込んだ状態で記述してくださいね まずはhtmlです。 C ……
こんな風に桜の花びらを散らすアニメーションです。 コピーして使ってください htmlはこちらです。 今回はこんな感じでimgにしてみました。 用意したのは桜の花びら4種類です。 この時点でもう可愛いですよね で、これを散 ……
LINK 今日はこれを作っていきます。 hoverしてみてね htmlはリンクを貼るだけです。 CSSもめっちゃ簡単 hoverしたタイミングで、text-shadowを使ってネオンっぽくしています。 HAPPY .ne ……
このhoverアニメを作っていきます。 hoverしてみてね hoverアニメーションの作り方 これを作るのに必要なパーツは以下の2つです。 円 アイコン この2つをhtmlでマークアップし、CSSで変化をつけてアニメー ……
次のようなデザインをコーディングする場合あなたならどうしますか? CONCEPT beforeを使って擬似要素を作り、ボーダーにする方法です。 ではコードを見ていきましょう。 h2はセンター配置しておきます。 「/」をp ……
↓こんなボタンを作っていくよ マウスホバーで隠れているアイコンたちが出現するボタンです。 htmlの考え方 これを作るのに必要なパーツは、角丸長方形とアイコンたちですよね。 アイコンの上に角丸長方形が乗っていて、マウスオ ……
コミュニティに参加するほどではないけれど、相談したいことがあったり、質問したいことがある方の為に、zoomを利用した1時間の単発レッスンをご用意しています。 5,500円/1時間 ご注意事項 こちらのレッスンは以下の時間 ……
コミュニティに参加するほどではないけれど、相談したいことがあったり、質問したいことがある方の為に、zoomを利用した1時間の単発レッスンをご用意しています。 5,500円/1時間 ご注意事項 こちらのレッスンは以下の時間 ……
CSSでよく使う単位についてまとめます。 絶対的なサイズの単位 px Pixels ピクセル デザインツールでフォントサイズを確認し、16pxなら、font-size: 16px;と指定可能です。 相対的なサイズの単位 ……
こんにちは。 WebクリエイターをしているMarieです。 今年、女性起業家さん向けの新サービスを提供予定の為、そのモニターさまを募集いたします。 概要 ご質問、ご相談はmmDesignホームページお問合せよりお送りくだ ……
かなり放置していたInstagramの投稿を再開しました。 そこで色々とメモしておきたいことが出てきたので記事にまとめてみます。 ただ、こちらの記事は有料とさせていただきます。 前回のInstagram考察記事(有料)は ……
写真を配置するときに、フレームどうしようかな?とデザインで悩むことってありませんか? そんな時の一案として、Instagram風のフレームはどうでしょうか 外枠にボックスシャドウを入れることで、抜け感を出すことができます ……