webプログラマー こびとの雑記

初めまして、こびとです。web系制作中心に、趣味のwordpress、仕事、アフィリエイトについて書いています。ぜひ読者登録お願いします

【2020】レスポンシブで左右を上下にするtable cellを使った本当にシンプルな方法(コピペ可)

すごい簡単になっていますね

図にするとこういうことがしたいだけ

レスポンシブ の動き

本当にシンプルな形

HTML

<ul class="resul">
<li class="resli"></li>
<li class="resli"></li>
</ul>

CSS

                .resul{
                    display:table;
                }
                .resul .resli{
                    display:table-cell
                }

                @media screen and (max-width: 641px){
                    .resul .resli{display: block;}
                }

もう少し調整すると

HTML

<ul class="resul">
<li class="resli"></li>
<li class="resli"></li>
</ul>

CSS

                .resul{
                    display:table; border-collapse:separate; border-spacing:5px 0;
                }
                .resul .resli{
                    padding:10px;
                    display:table-cell
                }

                @media screen and (max-width: 641px){
                    .resul .resli{display: block;}
                    
                }

【PHP】substrかmb_substrか半角カタカナの文字を切り出す細かいこと

日本語の場合、substrだと、全角に対応していないので、mb_substrを使うことになります。

半角カタカナが厄介ですね

$str = "カキクカキク"; echo mb_substr($str,0,1);

結果は

?

文字化け状態

結果

mb_substrですが、文字コードをちゃんと指定しないとうまく動かないことがあります。

mb_substr($str,0,1"utf-8");

やっていたソースは、UTF-8だったので、その指定をしたら、半角のカタカナも含め

$str = "カキク"; echo mb_substr($str,0,1"utf-8");

の結果も

と正常動作してくれました。

文字コード指定していないと桁数まで違ったのですが、ちゃんと文字コードを指定するだけで桁数も正常に動作してくれるようになりました。

はてなブログは書きかけの記事の自動保存をしてくれない?はてなブログの頑張って欲しいところ

f:id:afmx:20181210132603j:plain

このブログ、「放てなブログ」と言っても過言ではないように思う私です。

なんでかって?

500文字程度書いたブログ記事が、chromeのクラッシュで一瞬にして消えましたーーー

忙しい中の500文字、そして、全ての思考を消しながらの思考の中をそのまま文章に込めていました。

思い出して書けばいい?もうデリートされてますから。

文章初心者のこの気持ち。

そして、これが1回目でないこの気持ち。

いや、はてなブログが悪い訳でもなんでもありません。

自分が悪いのです。最近片付けの時間が取れず、chromeもがっつり色々なウィンドウやタブに溢れかえっていたのが原因ですよ

しかも、すぐであれば、こんな方法が残されていたのも知らず、迫り来る仕事に対応するため放置してしまいました。

https://www.yotuba.xyz/kijikieta/

結果、何をやっても戻ってきてはくれません。

はてなブログは、markdownに対応しているので本当に使えるやつだとは思います。

でも体が、記事を書きかけでも勝手に自動保存されるwordpressに慣れてしまっているせいなのか、書きかけでも放置する癖がついてしまっておりました。

結果、なんども書きかけの記事が消えるというブログ初心者あるあるのようなお手本の私です。

この書きかけの記事が消えてしまう問題を解決する方法

もう大問題です。

文字の入力も遅く、文章もひねり出さないといけない状況なので、もう残念で仕方ありません。

とは言っても、もうどうでもいいですけどね。こう言った記事で頭整理してますし。

はてなブログは、有料で記事自動保存ができない

有料プランでさえ、自動保存してくれないはてなブログってどうなんでしょ?

wordpressは、ブラウザで書いていてもほぼ自動保存されている

有料化もなんども考えました。

未だに迷っている有料化ですが、私の場合は、

どのページにアクセスがきているのか?

が知りたいだけです。

これに、自動保存がついていたら、もう最高だったのですが、調べる限りそう言った機能が追加されている訳でもないようです。

はてなブログのアプリはどうなのか?

はてなブログ用のエディタとかはどうでしょうか?

私は、macなので、

www.dahlia-lagoon.com

これは、あまり評判がよくないので使っていません。。

itea40.jp

iOS版使っていますが、mac版は買っていないのですが、アプリが良い悪い以前にブログは、ブラウザでやってしまう派のようで まだ、アプリ立ち上げてとか慣れておりません。

www.guheguhe.com

Marseditは、昔の方を購入して使っていましたが、やっぱりブラウザでやってしまう自分がいます。 アプリだとちょっともたついたり、すぐにプレビューできなかったり、きわめつけは、mac2台持ちなので、書きかけの記事がサーバーに残っている方が環境変わっても使えるので、今の所ブラウザなんです

はてなブログは気が向いた時に書いているので、自動保存のきくアプリも運用できなさそう。

ブラウザでサクッとメモのように書くのいいのです。

このブログも、もうwordpressに乗り換える時期なのかもしれません

所詮、一日に数十人しか見れてくれてないヘンテコ日記です

そろそろ、wordpressでも、運用してみようと思います

アクセス解析って、googleアナリティクス以外で最近使ってなかったけど、クライアントで違うの使っていた

調べてみると

高機能PHPアクセス解析「Piwik」

というもの。

Piwikという名前は、現在は

Matomo Analytics

として出しているようで、googleとは違った表示で

googleでは見れないものも表示できるかもしれません

結局、googleが良いように思うけど、、、

時間があるときにでも調べて見ますね

モリサワのフォントが、Windows10 October 2018 Update(1809)で標準搭載されるって、アップデートするしかないでしょ

現在、Windows 10 October 2018 Updateの提供は、不具合があるようで配信を一時停止しているため、まだ試せていません。

BIZ UDフォントっていうフォントが標準搭載ということで、これってweb業界にも関係ありそう。

あのモリサワフォントですから。

しかも、ゴシックと明朝です

読み易ければ、数年後にはwebでも普通に使われるようになるでしょうね。

webフォントもデメリットがあって使いづらいし

windowsでの、ブラウザのフォントがほんと悩んでいたので良い方向。

ただ、やったとか。

とも思う。。。

cssでbackgroundだけ透過させてテキストとかは、透過なしにしたい時はRGBaを使うと簡単

f:id:afmx:20180523221206j:plain

cssで透過というと、Opacityですよね

ただ、Opacityだと、その要素全てが透過になってしまいます。

今回、背景を透明にして、テキスト文字列は透過したくない

ということをやりたいので、その場合は、RGBa を使います。

文字とかも全部を透過したい時は、その要素にOpacity

opacity: 0.5;

みたいに使います。

0から1で指定します。

RGBaの使い方

background-color: rgba(0,0,0,0);

みたいに使います。これだと完全に透明です。

最後のパラメータに1を設定すると

background-color: rgba(0,0,0,1);

これで不透明。デフォルトです

前の3つの0は、色です。RGBなので、0-255、または、0%-100%と設定

赤い半透明にしたい場合は、

background-color: rgba(255,0,0,0.5);

です。

ipaファイルを実機にインストールする一番簡単な方法2018年版

iPhoneアプリを開発していて、もらったipaファイルだけを実機にインストールして試したいとき、今まではiturnsから左にあるサイドメニューの中に、appという名前があって、そこにドラッグドロップで簡単にできたと思っていたのですが、iturns 12.7(私の場合)では、app自体がないという。。。

私の環境ですが mac os10.12 ios11(iPad) iturns12.7 開発もしているので、xcodeも入っています

結論としては、iTurnsでできたよ

USBでmaciPadを繋げます。

iTurnsを立ち上げて、左のサイドメニューが以下のようになっていて、Appがないわけです

f:id:afmx:20180424112813p:plain

今までは、このAppにfinderにあるipaファイルをドラッグ&ドロップでできていたと記憶しています。

では、どこのドラッグ&ドロップすればいいのか?

f:id:afmx:20180424113115p:plain

赤枠のところでいけました。

解決!

ブログランキングに登録中です。ポチッとお願いします。^^
にほんブログ村 ブログブログ ブログノウハウへ
にほんブログ村