<?xml version="1.0" encoding="UTF-8" ?>
<rss version="2.0">
<channel>
<title>Blog</title>
<link>https://www.mutura.net/Blog/</link>
<description></description>
<pubDate>Tue, 02 Jun 2020 23:15:47 +0900</pubDate>
<generator>SOY CMS 3.14.14</generator>
<docs>http://blogs.law.harvard.edu/tech/rss</docs>
<language>ja</language>
<item>
<title>パイプあれこれその1</title>
<link>https://www.mutura.net/Blog/article/%E3%83%91%E3%82%A4%E3%83%97%E3%81%82%E3%82%8C%E3%81%93%E3%82%8C%E3%81%9D%E3%81%AE1</link>
<guid isPermaLink="false">https://www.mutura.net/Blog/article/49</guid>
<pubDate>Tue, 23 Jul 2024 23:25:38 +0900</pubDate>
<description><![CDATA[01単管

02イレクター（CREFORM（クリフォーム））]]></description>
</item>
<item>
<title>疑似科学</title>
<link>https://www.mutura.net/Blog/article/%E7%96%91%E4%BC%BC%E7%A7%91%E5%AD%A6</link>
<guid isPermaLink="false">https://www.mutura.net/Blog/article/48</guid>
<pubDate>Sat, 16 Jan 2021 00:19:58 +0900</pubDate>
<description><![CDATA[疑似科学
疑似科学を考える。（科学コミュニケーション研究所）]]></description>
</item>
<item>
<title>さくらチェッカー</title>
<link>https://www.mutura.net/Blog/article/%E3%81%95%E3%81%8F%E3%82%89%E3%83%81%E3%82%A7%E3%83%83%E3%82%AB%E3%83%BC</link>
<guid isPermaLink="false">https://www.mutura.net/Blog/article/47</guid>
<pubDate>Fri, 15 Jan 2021 22:24:00 +0900</pubDate>
<description><![CDATA[ECサイトのステマレビューを見抜くサイト。
https://sakura-checker.jp（サクラチェッカー）]]></description>
</item>
<item>
<title>@keyframesとanimation その1</title>
<link>https://www.mutura.net/Blog/article/keyframes%E3%81%A8animation_%E3%81%9D%E3%81%AE1</link>
<guid isPermaLink="false">https://www.mutura.net/Blog/article/45</guid>
<pubDate>Wed, 17 Jun 2020 15:27:20 +0900</pubDate>
<description><![CDATA[@keyframes はアニメーションの開始から終了するまで、どんな動きをするのかをするのかを指定。

例

@keyframes (animation-name（任意の名前）) {
0% {
CSSプロパティ:値;
}
100% {
CSSプロパティ:値;
}
}

animation はどのアニメーションを適用するのか、いつ開始されるのか、動作時間、繰り返し回数などを指定。

.abc {
    animation-name:  (animation-name（任意の名前）) ;
}

■■@keyframes関連プロパティ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
通常のcssで指定
■ 開始時widthが200px、終了時widthが300pxのアニメーションになる。
    0% {
        width:200px;
    }
    100% {
        width:300px;
    }



■ 半分時でwidthが400px、終了時widthが300pxのアニメーションになる。
    50% {
        width:400px;
    }
    100% {
        width:300px;
    }
}


■ opacity0;透明、opacity:1;不透明なども指定でき
■ 開始0%をfrom、終了100%をtoに置換することもできる。

■■animation関連のプロパティ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

■■ animation-name ■■
アニメーションの名前。@keyframesで指定。
例
.section {
    animation-name: （任意）;
}


■■ animation-duration ■■
アニメーションが始まって終わるまでの時間を指定。
s  1sは1秒
ms  1msは千分の1秒
例
.section {
    animation-name: （任意）;
    animation-duration: 3s;
}
}

■■ animation-timing-function ■■
アニメーションの進行を指定。
以下の９種類。
■ease
開始時と終了時は緩やかに変化。
■ease-in
開始時は緩やかに変化、終了に近づくと早く変化。
■ease-out
開始時は早く変化し、終了時は緩やかに変化。
■ease-in-out
開始時と終了時は、かなり緩やかに変化。
■linear
開始から終了まで一定に変化。
■step-start
開始時に最終の状態。
■step-end
終了時に最終の状態。
■steps(正数, start または end)
ステップス 指定した正数の段階で変化します。
第2引数にstartまたはendを指定。startを指定すると、開始時から変化。endを指定すると、終了時に変化。
■cubic-bezier(x軸の値, y軸の値, x軸の値, y軸の値)
変化の度合いを任意で指定します。3次ベジェ曲線で指定。
例
.section {
    animation-name: （任意）;
    animation-duration: 2s;
animation-timing-function: ease;
}
}

■■ animation-delay ■■
アニメーションが始まる時間を指定。
s  1sは1秒
ms  1msは千分の1秒

■■ animation-iteration-count ■■
繰り返し回数を指定。1

■■ animation-direction ■■
再生方向を指定。normal
normal 毎回、指定した通り（順方向）で再生。
reverse 毎回、逆方向から再生。
alternate 順方向、逆方向を交互に繰り返す。
alternate-reverse 逆方向、順方向のを交互に繰り返す

■■ animation-fill-mode ■■
■■ animation-play-state ■■
また、transform、transition
などなどはその2で]]></description>
</item>
<item>
<title>Flexboxについて。。。その1</title>
<link>https://www.mutura.net/Blog/article/Flexbox%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6%E3%80%82%E3%80%82%E3%80%82%E3%81%9D%E3%81%AE1</link>
<guid isPermaLink="false">https://www.mutura.net/Blog/article/43</guid>
<pubDate>Sat, 23 May 2020 16:45:58 +0900</pubDate>
<description><![CDATA[コンテナ（親要素）アイテム（子要素）に分けられる。ulliでも可。
コンテナにdisplay:flexを指定する。
■■■■■並び順（flex-direction）■■■■■
（デフォルト）左から右flex-direction: row;
右から左flex-direction: row-reverse;
上から下flex-direction: column;
下から上flex-direction: column-reverse;
■■■■■単一行と複数行の指定　（flex-wrap、プレフィックス版含む）■■■■■
（デフォルト）単一行に配置、アイテムは幅に収まるように縮小flex-wrap: nowrap;-ms-flex-wrap: nowrap;
複数行に配置、左から右へ、上から下へ、の順番flex-wrap: wrap;-ms-flex-wrap: wrap;
複数行に配置、左から右へ、下から上へ、の順番に。flex-wrap: wrap-reverse;-ms-flex-wrap: wrap-reverse;
■■■■■上記の二つ、並びと単一・複数行を一緒に定義　（flex-flow、プレフィックス版含む）■■■■■
flex-directionスペースflex-wrap
flex-flow: row nowrap;-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-flow: row nowrap;
■■■■■寄せと間隔　（justify-content、プレフィックス版含む）■■■■■
（デフォルト）アイテムを先頭に寄せて配置justify-content: flex-start;-webkit-box-pack: start;-ms-flex-pack: start;
アイテムを後尾に寄せて配置justify-content: flex-end;-webkit-box-pack: end;-ms-flex-pack: end;
アイテムを中央に寄せて配置justify-content: center;-webkit-box-pack: center;-ms-flex-pack: center;
先頭と後尾は端に、残りは等間隔に配置justify-content: space-between;-webkit-box-pack: justify;-ms-flex-pack: justify;
すべてのアイテムを等間隔に配置、各アイテムの両側に半分のサイズの間隔justify-content: space-around;-ms-flex-pack: distribute;
すべてのアイテムを等間隔に配置、各アイテムの周りに同じサイズの間隔justify-content: space-evenly;
すべてのアイテムを等間隔に配置。サイズがautoであるアイテムはコンテナに合わせて引き延ばすjustify-content: stretch;]]></description>
</item>
<item>
<title>aside 要素</title>
<link>https://www.mutura.net/Blog/article/aside_%E8%A6%81%E7%B4%A0</link>
<guid isPermaLink="false">https://www.mutura.net/Blog/article/42</guid>
<pubDate>Fri, 22 May 2020 19:57:13 +0900</pubDate>
<description><![CDATA[HTML5から新たに追加された要素。ウェブページ内における余談・補足情報のセクション。本文と関連してはいるけれど区別して掲載するべき内容。わかりにくい。。。]]></description>
</item>
<item>
<title>アップデート1.8.9</title>
<link>https://www.mutura.net/Blog/article/%E3%82%A2%E3%83%83%E3%83%97%E3%83%87%E3%83%BC%E3%83%881.8.9</link>
<guid isPermaLink="false">https://www.mutura.net/Blog/article/40</guid>
<pubDate>Sun, 07 Jan 2018 16:58:57 +0900</pubDate>
<description><![CDATA[アップデート1.8.9から/common/lib/soy2_build.phpの不具合。
soy2_build.phpだけ以前のまま]]></description>
</item>
<item>
<title>３・１独立宣言文</title>
<link>https://www.mutura.net/Blog/article/%EF%BC%93%E3%83%BB%EF%BC%91%E7%8B%AC%E7%AB%8B%E5%AE%A3%E8%A8%80%E6%96%87</link>
<guid isPermaLink="false">https://www.mutura.net/Blog/article/38</guid>
<pubDate>Thu, 16 Oct 2014 17:45:55 +0900</pubDate>
<description><![CDATA[1919年朝鮮半島で起きた独立運動。いわゆる「三・一独立運動」「独立万歳運動」「三・一事件」「万歳事件」の宣言文。1910年大日本帝国に併合された朝鮮国（大韓帝国）？の天道教・キリスト教・仏教の指導者たちと学生組織が中心の運動。
「万歳事件を知っていますか」木村悦子（平凡社）からの孫引きです。]]></description>
</item>
<item>
<title>ベーシック（BASIC）認証</title>
<link>https://www.mutura.net/Blog/article/%E3%83%99%E3%83%BC%E3%82%B7%E3%83%83%E3%82%AF%EF%BC%88BASIC%EF%BC%89%E8%AA%8D%E8%A8%BC</link>
<guid isPermaLink="false">https://www.mutura.net/Blog/article/36</guid>
<pubDate>Sun, 07 Sep 2014 00:13:13 +0900</pubDate>
<description><![CDATA[IDとパスワードでHPへの閲覧制限を掛けます。複数人の設定も出来ます。基本ディレクトリー単位なので複数ページで出来ます。検索エンジンもアクセスできない。だいたいのブラウザは、ID、パスワードは記憶できるまた、ブラウザを終了するまで有効。「.htaccess」を使用…サーバーによっては利用できない。
そんなベーシック（BASIC）認証について…備忘録。]]></description>
</item>
<item>
<title>画像表示の高速化</title>
<link>https://www.mutura.net/Blog/article/%E7%94%BB%E5%83%8F%E8%A1%A8%E7%A4%BA%E3%81%AE%E9%AB%98%E9%80%9F%E5%8C%96</link>
<guid isPermaLink="false">https://www.mutura.net/Blog/article/22</guid>
<pubDate>Mon, 14 Jul 2014 18:22:59 +0900</pubDate>
<description><![CDATA[たくさんのアイコンを一つにまとめて、読み込み速度を上げる方法。
「CSS Sprite」
]]></description>
</item>
<lastBuildDate>Wed, 24 Jul 2024 00:21:12 +0900</lastBuildDate>
</channel>
</rss>