SCSS

SCSS 連想配列的

SCSS 連想配列的

//配列作る$colors:( green:(1:#11945F,2:#33A76E,3:#51B484), blue:(1:#3491C1,2:#54A0CA,3:#6EAED2),);//★使う@each $key,$color in $colors{ //$keyにgreen,blueが入る .#{$key}{ //map-getを使用して$color,の1番目を指定する .contentsTitle { color: map-get($color

スキ
2
2021/8/11(水)

2021/8/11(水)

今日やったこと ・筋トレ(ダンベルトレーニング、腹筋ローラー) ・赤ちゃんのお世話(沐浴、おむつ替え) ・ダイニングチェアを購入 ・Javascript、jQueryの勉強 ・模写コーディングでサイト作成 ・preprosでscssの変数の設定をテスト

スキ
2
2021/8/10(火)

2021/8/10(火)

今日やったこと ・筋トレ(ダンベルトレーニング、腹筋ローラー) ・赤ちゃんのお世話(寝かしつけ、ミルク、沐浴) ・SCSS記述での開発環境設定でプリプロスを導入 ・変数設定でてこずる、、、 ・一時面接を行う

備忘録22:Rails-CSSを個別に適用する

備忘録22:Rails-CSSを個別に適用する

転職のための3月6日から某スクールにでプログラミング学習を始めた32歳のおっさんです。オリジナルアプリの開発が終わって一息。 C#とPHPの学習もしたい。 1:開幕の自問自答①CSSってページ毎に分けらんないんすか…  ⇨何事ですか ②RailsのCSSって全部読み込まれちゃうじゃん…  そのせいでクラス名がとっ散らかりすぎてやばいんす。  ⇨なるほどですね。 ③で、ページ毎に適用するCSS分けらんないんすか  ⇨分けられます ④マジすか?もっと早く教えてくれよぉ!!!  

スキ
1
【WEB制作】 スクロールに応じて固定 サラリーマン投資家のFIREへの旅路 第84夜

【WEB制作】 スクロールに応じて固定 サラリーマン投資家のFIREへの旅路 第84夜

本日は、ポートフォリオ制作の続きです。 こんな感じのを作ります! スクロール位置に応じて、見出しを固定したい! 【要素の固定】以前に、ヘッダーの固定で使ったのと、同じく 一定の位置までスクロールしたら、fixed というクラスをつけて 固定するっていう流れです。 「About」部分を例に見ていきましょう! 【html】HTML<!--About----------------------------------------------><section clas

スキ
3
cssで「〜以外の要素」を指定したいとき

cssで「〜以外の要素」を指定したいとき

CSSには「:not()」という、擬似クラスが存在している。(否定擬似クラスという) これは、指定されたセレクターに一致しない要素に対し動作します。 あんまりこんな単純な構造では使用しないかもしれませんが… 例hrml<ul> <li>1 リストリスト</li> <li>2 リストリスト</li> <li class="hogehuga">3 リストリスト</li> <li class="hogehuga">4 リストリスト</li> <li>5 リストリスト</li>

スキ
1
【Live Sass Compiler】@importのやり方

【Live Sass Compiler】@importのやり方

・Live sass Compilerのインストールインストール後、Live Sass Compilerの歯車アイコンから「拡張機能の設定」を選択 ワークスペースに移動 Autoprefixのsetting.jsonで編集を選択 下記コードコピペ Autoplefix/setting.json{ "liveSassCompile.settings.formats": [ //Sassの出力内容の設定 { "format": "expanded", //ne

macでのnodeバージョン管理ツールNodebrewのコマンド一覧

macでのnodeバージョン管理ツールNodebrewのコマンド一覧

node.jsの公式サイト nodeコマンド 現在のnodeのバージョン確認 $ node -vv14.15.4 現在のnpmのバージョン確認 $ npm -v7.6.1 Nodebrewダウンロード方法 Nodebrewコマンド インストール可能なバージョン一覧 nodebrew ls-remote インストール済みのバージョン一覧 nodebrew ls 指定したバージョンのインストール(vの後に数字がはいる) nodebrew install-

スキ
1
Laravel エラーページ作成

Laravel エラーページ作成

# 以下、相対パスに作成 resources/views/errors/【エラーコード】.blade.php 例:resources/views/errors/404.blade.php <html><body> <div> <p>ページが見つかりません</p> <a href="{{ url('/') }}">トップに戻る</a> </div></body></html> # 解説 Laravelのエラーページのカスタマイズは設定などは不要で、指定した位置にテンプレ

スキ
1