/// BANGBOO BLOG ///

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31


March 2020 List
恐慌からの脱出方法 on Mar 28, 2020 2:47 PM
CSS Grid on Mar 01, 2020 3:03 AM

March 28, 2020

恐慌からの脱出方法

ピケティ『21世紀の資本』たまむすび
https://miyearnzzlabo.com/archives/63853

ニューディール政策で金持ちに税金 第二次世界大戦の時には90%に
1960年ぐらいまでいろんな形でずっと再分配して「中流」というものが生まれた

フォードは共産主義が嫌いだった、一般の給料の2倍以上にし
労働者を中流にすることで、余裕を持って車を買う消費者にした

1980年ぐらいまで日本って金持ちに対する税金は最高で75%だった
大企業に対しては法人税は50%だった
だから、日本は1970年ぐらいに「1億総中流」って言われた
2006年以降長者番付は発表されてない

金持ちばかりが金持ちになって、貧乏人にはいつまでたっても貧乏のまま
強制的に国が法律でそれを平等にするように力をかけなければ絶対に中流は生まれない
富の再分配をするしかない

モノポリーって大恐慌の時に破産した人が作ったゲーム
起業家が暴走して勝手なことをやり続けると完全な独裁になってその人以外の経済活動が全部潰されてしまう

倍の差をつけたらどうなるか?っていう実験をこの映画の中ではする
最初からどんどんどんどん物件を買える人と全然買えない人に分かれる 絶対に逆転が起こらない
で、逆転が起こらない状態でゲームをしている人はどうなるかっていうと、
最初から倍のお金をもらった人が、最初からお金をもらっていなかった人をバカにするようになる
サディスティックにいろんな不動産とかを買って、最初にお金を持ってなかった人を追い詰めていくような態度を取る

3年間にダウ平均1.5倍ぐらい 1億円を持っている人はそれが1億5000万円になっている
1億円を持っている人は何もしなくても、年収が1600万円
-----------
貯蓄は善行、投資も善行とすると→金融や不労所得自体は悪ではない?
大企業も金融や投資で利益を上げる、周りがやっていると参加せざるを得ない
何が駄目か→格差が駄目である、適切に再分配 本業回帰

-----------
ニューディール政策
国家が市場を統制して人々を保護し、また公共事業を積極的に推進して雇用を創出
「金本位制」を停止 政府が通貨を発行する「管理通貨制度」
預金者を保護するための「連邦預金保険公社」の設立
銀行を安定して経営するために証券と分離させる「グラス・スティーガル法」
「農業調整法(AAA)」を制定 農業生産量を政府が管理
「ワグナー法」を制定し、労働者の「団結権」「団体交渉権」「ストライキ権」
市場原理を重視する大企業などの反発
後世の研究者たちからも、不況脱出の決め手とはならなかったという指摘がある
世界恐慌前の水準を超える決定打となったのは、アメリカの第二次世界大戦への参戦と

Posted by funa : 02:47 PM | Column | Comment (0) | Trackback (0)


March 1, 2020

CSS Grid
Grid、Flex、旧(Float、position) は混在する
位置の調整はposition
 親要素にposition:relative
 該当要素にposition: absolute;
  top: 100;
  right: 20;
  z-index: 10; 必要なら大きいのが上
CSSのpositionを総まとめ!absoluteやfixedの使い方は? (saruwakakun.com)
中央寄せ
 文字を中央寄せしたいなら外のブロック要素に「text-align:center」
 ブロック要素自体をしたいなら 「margin-left:auto; margin-right:auto;」
  paddingにautoは指定不可、margin: autoの中央寄せの微調整はpaddingで
  widthプロパティの初期値はauto (横いっぱいに広がっているのでwidthを入れる)
  inlineの要素では、widthとheightの指定不可
.center_area {
min-width: 450px;
max-width: calc(61% - 20px);
margin-top: 40px;
margin-left: auto;
margin-right: auto;
padding: 0px; 50px; 0px; 0px;
}
CSSの余白(margin/padding)と中央配置にする方法【CSSの書き方入門】 | Skillhub[スキルハブ]
テーブルの幅指定
 複数テーブルのレイアウト整合はtr width%指定とtd/tr nowrapを細かくすればなんとかなる
AJAX
 JS fetchで
【CSS】colorが効かない/文字色が変わらない原因と修正方法 (csshtml.work)
点数制、同点なら後述が勝つらしい


■CSSアニメーション
transition に時間を入れておき、JSでclassをremoveしたりaddする
変化にその時間分を掛ける動作となる
 now_classからfuture_classの2つをCSSで作り、JSでremoveやaddをする

[B! css] 2022年のモダンCSS改 (hatena.ne.jp)

中央揃え
.container{
  display: flex;
  justify-content: center;
  align-items: center;
}
.container{

  display: grid;
  justify-content: center;
}

アンカーリンク移動をスムーズにする
html {
  scroll-behavior: smooth;
}

スクロールで位置をずらすトップからのマージン
section {
  scroll-margin-top: 60px;
}

すりガラス
.box{
  backdrop-filter: blur(8px);
  background-color: rgba(255, 255, 255, 0.5);
}

1行でも両端ぞろえ
th{
  text-align-last: justify;
}

ナビがfixedの場合の本部のスクロール連動をなくす
.navi{
  overscroll-behavior-y: contain;
}

++++++++++++++++++
2020-03-01 wrote
Gridは悪名高いテーブルレイアウトと考え方がまるで同じ
CSSの方が糞であったであろう、テーブルこそが発明でしょうに、セマンティック?
containerにdisplay: grid か flex か table を指定するので直接の要素には混在不可、入れ子なら可
https://ics.media/entry/15921/

■CSS grid
https://qiita.com/kura07/items/e633b35e33e43240d363
https://qiita.com/kura07/items/486c19045aab8090d6d9
 ページ全体のレイアウト、グリッドレイアウト
 コンテナを作り、グリッドに名前を付けて、割り当てる
 <section class="container">
  <div class="visual">(メインビジュアル)</div>
  <div class="number">(数字)</div>
  <div class="expression">(テキスト)</div>
  <div class="other">(3枚の写真)</div>
 </section>

 .container {
  display: grid;

  grid-template:
   "visual number expression" 1fr
   "visual other other" 220px /
   40% 120px 1fr;
 }

 .visual {
  grid-area: visual;
 }


 @media (max-width: 800px) {
  .container {
   grid-template:
   "visual visual" 100vw
   "number expression" 1fr
   "other other" auto /
   120px 1fr
  }
 }

■Flexbox
https://www.webcreatorbox.com/tech/css-flexbox-cheat-sheet
https://qiita.com/junya/items/7762da8052d86462f232
 縦横揃え、可変サイズ、でも複数配置が駄目、1行の並び
  justify-content
  align-items
  flex-grow
  flex-shrink

 .container {
  display: flex;
  justify-content: center;
  align-items: center;
 }

■display: table / display: table-cell
https://techacademy.jp/magazine/19415
https://app.codegrid.net/entry/css-table-1
https://www.yoheim.net/blog.php?q=20150102
https://nxpg.net/blog/tech/?p=10764
CSSのvertical-alignが効かない縦並び(display:gridの中にdisplay:tableの中にdisplay:table-cell)
#container{
 display: grid;
 grid-template-rows: 25px 1fr;
 grid-template-columns: 300px 1fr 200px;
}
#column_right{
   grid-row: 2;
 grid-column: 3 / 4;
 display: table;
}
#area{
 background-color: #eee;
 width: 150px;
 height: 150px;
 text-align: center;
 display: table-cell;
 vertical-align: middle;
}
<div id="container">
  <div id="navi_left">...</div><div id="navi_right">...</div>
  <div id="contents">...</div><div id="area">...</div>
</div>

■Float
 テキストの回りこみ
 .leftBox {
     width: 45%;
     float: left;
 }

Floatレイアウト
https://www.bangboo.com/cms/blog/page_18.html
Padding/Float/Height100%の問題
https://www.bangboo.com/cms/blog/page_184.html

■object-fit
 画像の比率
 img {
  object-fit: cover;
 }
 .image1 {
  object-position: 30% 40%;
 }

■その他
spanタグにline-heightを設定しても行間は設定できない、display:block;を追加するか親で設定する
ボックス要素のセンタリング(中のテキストは左寄せ)
 <div style="width:500px"><div style="text-align:left; display:inline-block;">
 https://qiita.com/KAMEch/items/b52c5e23212b8fef81a7
 https://www.granfairs.com/blog/staff/centering-by-css

リストのマーカの位置に迷った
ulのpadding-leftが外側からマーカの右側迄の距離で15pxとかは必要
liのpadding-leftはマーカの右からから先頭文字までの距離で0px等で良い
https://maku77.github.io/web/layout/list-margin.html


2019見直したいCSS,Javascript
https://speakerdeck.com/tonkotsuboy_com/2019nian-madenijian-zhi-siteokitai-cssjavascriptfalseshou-fa

CSSレイアウト再入門:完全に理解してCSSを記述するために - Speaker Deck
実例で学ぶFlexboxとCSS Gridの使い分け – TAKLOG (tak-dcxi.com)
2024年、Web制作者がチェックしておきたいCSSの新機能のまとめ | コリス

Posted by funa : 03:03 AM | Web | Comment (0) | Trackback (0)


PhotoGallery


TWITTER
Search

Mobile
QR for cellphone  QR for smart phone
For mobile click here
For smart phone click here
Popular Page
#1Web
#2Hiace 200
#3Gadget
#4The beginning of CSSレイアウト
#5Column
#6Web font test
#7Ora Ora Ora Ora Ora
#8Wifi cam
#9みたらし団子
#10Arcade Controller
#11G Suite
#12PC SPEC 2012.8
#13Javascript
#14REMIX DTM DAW - Acid
#15RSS Radio
#16Optimost
#17通話SIM
#18Attachment
#19Summer time blues
#20Enigma
#21Git
#22Warning!! Page Expired.
#23Speaker
#24Darwinian Theory Of Evolution
#25AV首相
#26htaccess mod_rewite
#27/// BANGBOO BLOG /// From 2016-01-01 To 2016-01-31
#28竹書房
#29F☆ck CSS
#30Automobile Inspection
#31No ID
#32Win7 / Win10 Insco
#33Speaker
#34Arcade Controller
#35Agile
#36G Suite
#37Personal Information Privacy Act
#38Europe
#39Warning!! Page Expired.
#40GoogleMap Moblile
#41CSS Selectors
#42MySQL DB Database
#43Ant
#44☆od damnit
#45Teeth Teeth
#46Itinerary with a eurail pass
#47PHP Developer
#48Affiliate
#49/// BANGBOO BLOG /// From 2019-01-01 To 2019-01-31
#50/// BANGBOO BLOG /// From 2019-09-01 To 2019-09-30
#51/// BANGBOO BLOG /// On 2020-03-01
#52/// BANGBOO BLOG /// On 2020-04-01
#53Windows env tips
#54恐慌からの脱出方法
#55MARUTAI
#56A Rainbow Between Clouds‏
#57ER
#58PDF in cellphone with microSD
#59DJ
#60ICOCA
#61Departures
#62Update your home page
#63CSS Grid
#64恐慌からの脱出方法
#65ハチロクカフェ
#66/// BANGBOO BLOG /// On 2016-03-31
#67/// BANGBOO BLOG /// From 2017-02-01 To 2017-02-28
#68/// BANGBOO BLOG /// From 2019-07-01 To 2019-07-31
#69/// BANGBOO BLOG /// From 2019-10-01 To 2019-10-31
#70/// BANGBOO BLOG /// On 2020-01-21
#71Bike
#72Where Hiphop lives!!
#73The team that always wins
#74Tora Tora Tora
#75Blog Ping
#76無料ストレージ
#77jQuery - write less, do more.
#78Adobe Premire6.0 (Guru R.I.P.)
#79PC SPEC 2007.7
#80Google Sitemap
#81Information privacy & antispam law
#82Wifi security camera with solar panel & small battery
#83Hope get back to normal
#84Vice versa
#85ハイエースのメンテ
#86Camoufla
#87α7Ⅱ
#88Jack up Hiace
#89Fucking tire
#90Big D
#914 Pole Plug
#925-year-old shit
#93Emancipation Proclamation
#94Windows env tips
#95Meritocracy
#96Focus zone
#97Raspberry Pi
#98Mind Control
#99Interview
#100Branding Excellent
Category
Recent Entry
Trackback
Comment
Archive
<     March 2020     >
Sun Mon Tue Wed Thi Fri Sat
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31
Link