なのブログ

   

メンタル障害持ちながらA型就労で広告デザインやWebをしている人のブログ

カテゴリー: CSS

【CSS+JS】スクロールでふわっと出てくるフェードインの実装方法【jQueryなし】

画像や要素などがスクロールするとふわっと出てくる「フェードイン」の実装方法をまとめます。仕事でやることになって、調べましたが自力でも出来そうだったので、私のようにjQueryに依存しないで実装したいという方のために書きます。ちなみに私はjQueryは個人的に苦手でまったく書けないです…。 適当なHTMLを用意しました。ここではh1と内容全体にフェードインさせるクラスを付けました。 JavaScri […]

Read More

卒業制作展②

制作テーマ 「かわいい×たべられる」をコンセプトに、架空のかわいいお菓子を提供するカフェを作り、Webサイト、オリジナルレシピ集、ショップカードなどを展開。いつまでも乙女心を忘れないすべての女性に捧げる作品。 チラシについて 苦労した点 作業工程の写真を撮るのに、手が汚れているためにかなり苦労しました。手早く作業をする必要のある工程はとくに写真を撮るのが大変でした。また初心者でも手軽に作れるよう、 […]

Read More

卒業制作展①

トライデントコンピュータ専門学校で行われた卒業研究制作展終了しました。たくさんのご来場、誠にありがとうございました。 私は2日間ともに午前中に作品の案内をさせていただいたのですが、とくに質問の多かった事項についてと、個人的にがんばったところなどをまとめていきたいと思います。 制作テーマ 「かわいい×たべられる」をコンセプトに、架空のかわいいお菓子を提供するカフェを作り、Webサイト、オリジナルレシ […]

Read More

【HTML+CSS】divを横並びにする方法

私が3年ほど前に習ったのはfloatでしたが、専門に入ってからはflexボックスを習ったので改めて書きます。 並べたい子要素の親にこう書きます。 CSS display: flex; justify-content: space-between; align-items: center; justify-contentは水平方向にどのように揃えるかです。space-aroundなど他にもいろいろあ […]

Read More

WordPressでHTMLを編集する方法

タイトルはWordPressでHTMLを編集、と書いてありますが、大幅な変更はテーマのPHPファイルをいじる他にはできません。ここで紹介するのはある程度HTMLの知識がある方向けで、文字のここだけ変えたいなー的な小さな要望なら叶えられる程度のものです。 まずサイトの変えたい箇所あたりを右クリックで検証します。例えば検索バーの場合は検索バーに該当する箇所をソースの中から探してください。そこにあてられ […]

Read More