マガジンのカバー画像

WEB制作

168
本
本業にすべく奮闘中のWEB制作の備忘録的存在
運営しているクリエイター
S.A.P.Studio

#HTML_CSS

【 WEBデザイン 】 ポートフォリオでよく使うスキルのレイアウト　FirE♯590

ポートフォリオサイトに使えそうなスキルの度合いを示すバーをコーディングします。 完成品は…

S.A.P.Studio
S.A.P.Studio
1年前
1

【 WEBデザイン 】 コードハッピーセット　「アコーディオンメニュー」FIREへの旅路 …

WEBサイトのデザイン、コーディングで頻出の機能のコードを、 HTML、CSS(SCSS) 、JavaScriptを…

S.A.P.Studio
S.A.P.Studio
1年前
1

【 WEBデザイン 】 コードハッピーセット　「スライダー」FIREへの旅路 ♯493

WEBサイトのデザイン、コーディングで頻出の機能のコードを、 HTML、CSS(SCSS) 、JavaScriptを…

S.A.P.Studio
S.A.P.Studio
1年前
2

【 WEBデザイン 】 コードハッピーセット　「タブメニュー」FIREへの旅路 ♯492

WEBサイトのデザイン、コーディングで頻出の機能のコードを、 HTML、CSS(SCSS) 、JavaScriptを…

S.A.P.Studio
S.A.P.Studio
1年前
2

【 WEBデザイン 】 コードハッピーセット　「ハンバーガーメニュー」　FIREへの旅路 …

WEBサイトのデザイン、コーディングで頻出の機能のコードを、 HTML、CSS(SCSS) 、JavaScriptを…

S.A.P.Studio
S.A.P.Studio
1年前
2

【 jQuery 】 Drawer.jsを使ってドロワーメニューを簡単コーディング ♪ 投資家のFI…

ドロワーメニュの簡単な実装方法をご紹介します！ 簡単すぎて罪悪感すらありますが、車輪の再…

S.A.P.Studio
S.A.P.Studio
2年前
4

【W E B 制作】 超簡単便利！グリッドレイアウトをマスターしよう!! 投資家のFIREへの旅路 第288回

簡単にさまざまなレイアウトが組めてしまう、グリッドレイアウトを解説します！ 1から書くのは正直ややこしいですが、無料のWEBサービスを使って簡単にコーディング可能です！ 便利ツールは使ったもの勝ちです！ 【グリッドレイアウト】こういったレイアウトが簡単に作れます。 コードは以下の通りです。 〈 HTML 〉 <!--HTML--> <div class="grid-container"> <div class="title"><p>グリッドレイアウトを

S.A.P.Studi…

【WEB制作】 tableタグをマスターしよう！ 投資家のFIREへの旅路 第285回

htmlで表を作る<table>タグについてまとめます。 基礎的なことだけど、なんか毎回よくわからな…

S.A.P.Studio
S.A.P.Studio
2年前
2

【WEB制作】 画像ファイルの種類 投資家のFIREへの旅路 第283回

WEBサイトを作る上で、重要になる画像。 画像ファイルの種類って色々あって正直、どんな時にど…

S.A.P.Studio
S.A.P.Studio
2年前
6

【HTML CSS 独学9】 基礎を固めて高く積み上げ！　「box-shadow」を整理しよう！ 　投…

要素に影をつけるCSSのbox-shadowを振り返ります。 地味なエフェクトですが、 あるのとないの…

S.A.P.Studio
S.A.P.Studio
2年前
1

【簡単】 HTML CSS 独学方法 ５選＋１！オススメコンテンツを紹介します　個人投資家…

WEBデザイナーの仕事において、コーディングができることは強みです。 会社によっては、兼任…

S.A.P.Studio
S.A.P.Studio
2年前
14

【WEB制作】 マウスオーバー時の動き サラリーマン投資家のFIREへの旅路 第93夜

本日は、ポートフォリオサイトの続きをやります。 これをやることで、html , cssの学習中の方…

S.A.P.Studio
S.A.P.Studio
3年前
5

【WEB界隈のポートフォリオ】 サラリーマン投資家の、FIREへの旅路 第72夜

本日は、投資のポートフォリオではなく、WEB制作のポートフォリオのお話 ただいま、製作中の…

S.A.P.Studio
S.A.P.Studio
3年前
37

【WEB制作】ふんわり表示「ScrollReveal.js」サラリーマン投資家のFIREへの旅路 第73夜

本日は、「要素をふんわり表示する」を実装します！ これ、ほんまに超簡単！ 肌感だと、一行書くだけ！ こんなやつね。オシャレサイトでよく見ますよね〜 【ScrollReveal.js】スクロールした時にふんわり表示このふんわり表示は、このScrollReveal.jsっていうやつを使っていきます。 これは、javaScriptのライブラリというものです。 つまりは、唐揚げ定食です。 １から書くとなると、料理の勉強をして 調味料や、野菜、鶏肉、お米を準備して、調理して

S.A.P.Studi…