css– category –
-
【SWELL】ヘッダーのロゴを右寄せする方法
SWELLはヘッダーのロゴを右寄せする設定がカスタマイズにありません。 日本人は右利きが多いから、メニューは右にあった方が使いやすいという観点からこのようになっているのだと思いますが、クライアントによっては「ヘッダーのロゴ右寄せしたいやで」っ... -
【CSS】positionのstickyとabsoluteを一緒に使う方法
友達からサイト制作のお仕事を頂いたので、遊びながら作ってたのですが、stickyめっちゃ楽しいですね。 一定の場所まで行ったら流れてくれるので、例えばTOPページの要素要素のタイトルや画像を固定しておくとなんとなく格好いいような印象になります。 た... -
【CSS】背景画像にドットの網掛けをCSSで簡単に作る方法
サイト全体に背景画像を設置したとき、 「格好いいけどもうちょっとお洒落感をプラスしたいなあ」「素敵な背景画像だけど文字が目立たない気がする……」「もうちょい個性をプラスしたい!」 このように、”あともうちょっとなんだけどな”現象に悩むこと、あ... -
【css】SWELLで数字を入れる飾り枠
工程項目を入れる時に、数字が入れられる飾り枠が便利です。 便利というか、必要に駆られてさっき作ったので、忘れないうちに書いておく次第です。 こちらのカスタマイズはSWELL利用を前提としていますが、SWELL以外でも使えます。 【数字を入れる飾り枠】... -
Youtubeの最新動画埋め込みで「この動画は再生できません」と出る理由
つい最近の案件で、TOPページに「依頼者のYoutubeチャンネル最新動画」を埋め込む案件がありましたので、希望通りに”最新動画がアップロードされると表示される”ようにYoutubeを埋め込んでみたところ すみません、「この動画は再生できません」と出ちゃい... -
SWELLでグーグルマップを全幅で埋め込む方法
こんにちはー!突然ですがグーグルマップの全幅埋め込みって可愛いですよね。 ライトニングプロとかだと確かカスタムHTMLにいれて「width: 100vw」とでも書いておけばそれでOKだったんですけど、SWELLだとちょっと勝手が違ったので、私みたいに「え?どう... -
ヘッダーにあるナビメニューをそのままフッターに移動させたい
どうもー白石です。今日はヘッダーにあるナビメニューをそのままフッターに移動させる簡単な方法を記します。 ヘッダーにあるナビメニュー、これはこれでいいんですけど、人によっては 「このナビメニューをフッターのほうで表示させたいなあ」 という場合... -
【css】opacityで背景色だけ消すの×transparentかrgbaをお使いなさい
「ヘッダーを透過させたい!」 と考えている人の中には、ヘッダー全体だけではなくヘッダーのうちのヘッダー背景色だけ消したい・半透明にしたいと考えている方もいらっしゃるかもしれません。 「半透明と言えばopacity!」 と、グーグル検索でも出るのでo... -
【css】半透明にしたい時に便利なopacity(オパシティ)
サイト製作をしているときに、ヘッダーやボタンなど、なんとなく半透明にしたいときがあります。 不透明のデザインでも格好いいですが、 抜け感的な演出をしたいときに半透明を設定すると中々格好よく仕上がるんですよね。 今回はそんな時に使うopacityの...
1