ChromeのデベロッパーツールでCSSのコピーが使いづらくなった。
htmlをいじってると見た目の調整でChromeのデベロッパーツールでCSSの数値を調整することがよくあります。
調整が終わってCSSファイルに数値をコピペするんですが、新しいChromeは変な改行が入ります。
一行だけコピーするとこんな風になります。
なんか微妙な事になったなあと思っていたら、この記事を書いているうちに自己解決。
右クリックで宣言を全てコピーなどを選ぶと大丈夫みたいです。
けど、一行づつコピーしても改行入らない方が楽だったなあ。いちいち右クリックとか手間が一個増えた感じ。
04webserverでのsvgの表示
ローカルのマシンで、04webserverを使っている時に、
今までsvgの画像が表示されなかった。
MIMEタイプの設定を追加すれば動くと言う事だったので、
追加してみたのだけれど全然表示されなかった。書き方は
AddType image/svg+xml .svg
AddType image/svg+xml .svgz
だったので、04WebServerには
image/svg+xml svg
image/svg+xml svgz
と言う2行を付け足したのだけれど動かなかった。
何回かいろんなやり方試したんだけど駄目だったのだけど、
また今日表示させたい案件があってしつこくやってみた!
結果、表示された。
image/svg+xml svg svgz
って一括りに書く方法だとでた。
これでローカルのテストも同じように表示できて快適です。
ブラウザによるフォームのバリデーション機能
前はフォームに入力が無いと入力して下さいを出すのに、JavaScriptとか
サーバから返したりしてたんだけど、今は機能としてあるのでちゃんと確認します。
https://www.marineroad.com/staff-blog/14752.html
http://www.atmarkit.co.jp/ait/articles/1104/25/news137.html
↑ここら辺のを見ました。
1. required属性による入力必須制約
2. pattern属性による入力値のパターン制約
3. type属性に応じた入力値のタイプ制約
4. step属性による入力値制約
5. min属性、max属性による入力値の範囲制約
6. maxlength属性による入力値の長さ制約
入力されてない箇所があると警告みたいのが出ますね。
古いブラウザだと出ないのですが、JavaScriptきってても
出るのはいいですね。
Emmet便利やね。
http://sole-color-blog.com/blog/internet/1049/
Emmetが便利って記事。
DreamWeaverに入ったから絶対覚えた方が早いな。つうか早い。
そんなにhtmlばっか書くことも無いけど、書く時覚えておいたら絶対早いね〜。
前の名前Zen-Codingって名前は聞いたことあったけど、
早くから覚えておけば良かった気もする。
まだ無意識で打てるようにはなってない。
SASS
DreamWeaverでSASSが使えるようになったので使ってみます。
「CSSプリプロセッサー」ってやつね。
あと、仕事で bootstrap使ってやることになったから最新を確認して、
DreamWeaverでEmmet使えるって書いてあって普通に使えたので使ってみよう。
今までゲームとかメインでhtmlは手書き止まりだったけど、
Emmetできると爆速らしいから練習しよう。
https://blogs.adobe.com/creativestation/web-learning-emmet-abbreviations-for-html
html専門じゃ無いから今知ったの?って感じだろうけど、覚えよう。
いま、 Emmet でもCSSかけるって書いてあったのみて、 SASS とぶつかるというか
どうやって両方使っていくのか不安になったけど、両方使ってやりましょう。みたいな
記事があったのでできそうなのですすめてみます。
【追記】
あと、
CSS設計における3大メソッド[OOCSS][BEM][SMACSS]
http://www.risewill.co.jp/blog/archives/5652
だってさ。
なんかちょっとしたことを一括りにして名前つけて「自分●●使ってまス。」
みたいなこと言わないといかんのかねえ。全部CSSの書き方なんだろうけど。
まあやってればなれるのかな。
bootstrap IE スクロールバー
bootstrapでサイトを組んでいたら、IEで右のスクロールバーが
出ているところがかぶっていて変だったので、「bootstrap IE スクロールバー」
でググってみた。
そしたらこんな記事が、↓
http://cly7796.net/wp/css/scrollbar-overlaps-the-content-when-viewed-in-initenet-exproler-when-you-use-the-bootstrap/
@-ms-viewport {
width
:
auto
;
}
って書けば直ると書いてあるので、
custom.css
につけたしてみたら、無事直りました!
MT5でSQLite
自分で試してみた。
何カ所か見たんだけど、結局MT5入れて、SQLite Integration落として、
プラグインの所に、SQLite Integration入れて、db.phpを入れて、
MT5のインストール進めると、db.phpどこ?って聞かれるから、
指定してやったら動いた。
MT5でSQLiteはサポートしてないみたいなんだけど動くとみんな言ってるし、
動いたような気がします。
個人のあまり人に見られないページの場合これでOKですね。
同時に書き込んだりすると落ちるらしいですが。
CSSでinitialで幅をリセットしようと思ったらIEでリセットされなかった
h3{
width:initial;
}
と書いたらIEだけリセットされなかった。
http://webdev.jp.net/css-max-min-width-height-reset/
を見て、リセットするようにした。
h3{
width: initial;
width: auto;
}
と書いたらうまくいった。
上記の記事で、max-width,max-heightを知り、何に使うのかと思っていたら
「アスペクト比(縦横比)を維持したまま200×200の枠内に収まるよう画像を縮小する」
と書いていたので、そういう使い方するのか。と思いました。
やっぱ作らないと使わないから知らないままになっちゃうね。