No description, website, or topics provided.
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
bulma column+is-nとradio,checkbox May 3, 2018
compassdemo
dist/css
ejssample
flex
font-awesome
image_for_slide
less
prohazusample/01
sample
samplesite01
samplesite02 display tableのよるセンタリングとheightの決定 Dec 30, 2017
samplesite03
samplesite04 standard typeサイトのコーディング Dec 31, 2017
sass headerとmainのhtmlとcssを組み込む Oct 9, 2017
src node_modulesを読み込んだオリジナルcssの作り方 Nov 25, 2017
.editorconfig
README.md
animation.css
animation.html
animation.js
apple01.jpg
bower.json
config.js
font_chousei.css
font_chousei.html
fontsize.html remに関して Jan 14, 2018
gulpfile.js
image_font.html
jquery-3.3.1.min.js
jquery.tablefix.js
main_visual.css
main_visual.html
main_visual2.css
main_visual2.html
margin_float.html
matsui_rena.jpg
modal.html
original_pararax.css
original_pararax.js
original_pararax.php
package-lock.json
package.json
position.css
position.html
reika.jpg
table.css
table.html
table2.css
table2.html
vertical.html

README.md

css

ファイル概要

  • animation.html cssを使った動的なアニメーション keyframe,animate, transition, before&afterの枠線, scroll検知など

  • font_chousei.html fontサイズ vwの使用など

  • fontsize.html %表記,px,remなどについて

  • image_font.html cssが画像とフォントサイズについての制御パターン

  • main_visual.html メインキャッチ画像の固定方法などについて。backgroundがらみのプロパティ説明

  • main_visual2.html 大型の背景画像の固定方法について。

  • margin_float.html floatを使ったレイアウトの組み方について

  • modal.html bootstrapを使ったモーダルウィンドウについて

  • original_pararax.php transformを使ったpararaxエフェクトに関して

  • position.html positionの細かい挙動などについて

  • table.html tableについて。各幅のロジックがどのように決まるかなど

  • table2.html 固定テーブルの挙動について JSのライブラリ(jquery.tablefix.js)とcssを使ったパターンに関して

  • vertical.html テーブルの中央よせに関して

  • gulpfile.js gulpを使った(less,sass,ejs)コンパイルに関して

  • prohazusample 書籍「プロとして恥ずかしくない新CSSデザインの大原則」のソース。比較的オーソドックスなページのレイアウトについて

  • sample/index.html 比較的小ネタ的なCSSについて。書籍「初めてのCSS設計」ネタ多し。またカスタマイズされたチェックボックスなど。

  • samplesite01 書籍「現場のプロが本気で教える」HTML/CSSデザイン講義

  • samplesite02〜04 サイトの作成サンプル。書籍「HTML5/CSS3モダンコーディング」のサンプルなど

  • src/customer.scss mystyle.scssとmyvariable.scssの読み込み。これ1つで他のcssを読み込める

  • sass/sample.scss sassの基礎的なサンプル

  • flex flexのサンプル

  • ejs ejs(htmlのテンプレートエンジン)を使ったサンプル(gulpで吐き出す)

  • compassdemo compassを使ったdemo。201709ごろ使用。

  • bulma bulmaを使ったhtmlのサンプル

bowerインストール

bower.jsonに記述されたライブラリを読み込み

bower install

npmインストール

package.jsonに記述されたラリブラリの読み込み

npm install

npmスクリプトの活用

package.jsonのscriptに書かれたものが走る

npm run test

npm run css

gulpの活用

npm run gulp (タスク名)

上記のタスク名はgulpfile.jsの記述を参考に。 gulp.task(・・・) ここがタスク名になる