2017-08-21

sketchで要素間の幅を測る

sketchである要素間のマージンが何ピクセルあるか調べる時にとっても便利なショートカットキーがあります。

それは調べたい要素にフォーカスをあてた状態でaltを押し続けるだけです。

f:id:chocotaka:20170821234134g:plain

あとはカーソルを動かしてみると、数値が表示されます。

とても便利でディベロッパーは一番使うであろうショートカットキーです。

2017-08-15

URIとURLとURN

Webを支える技術 ── HTTP，URI，HTML，そしてREST（WEB+DB PRESS plusシリーズ）｜gihyo.jp … 技術評論社

先日購入した本から１つ。

世間一般的に使われている言葉でURLがあります。

URLはサイトのアドレスを指す時に使ったりしますが、正しい名称はURIです。

正確に言うとURIはURLとURNの総称です。

URNは例えばこのようなものurn:isbn:1111111

例のisbnは世界基準で決まっている書籍のIDになります。

URL: Location/リソースの場所
URN:Name/リソースの名前
URI:Identifer/リソースを識別

URIという言葉は普段使わないですが、実際の総称はURIという事を知る事ができました。

2017-08-10

【css】クラスの付け替えで擬似要素は上書きできない？(解答編）

先日書いたこちらの記事

【css】クラスの付け替えで擬似要素は上書きできない？ - chocotakaの日記

こちらchromeの仕様のようで、safariやfirefoxで検証した結果上書きする事が出来ていました。

もしこのような実装にぶつかることがありましたら、気をつけてみるのはよいかもしれません。

2017-08-09

【css】クラスの付け替えで擬似要素は上書きできない？

cssの擬似要素でよく使う:beforeと:afterがあります。

クラスを付け替えてスタイルを指定しようとしていたのですが、擬似要素のcssは上書きできませんでした。

f:id:chocotaka:20170809225733g:plain

最強の!important攻撃ですら効きませんでした。cssは奥が深い。

2017-08-08

【css】特定の属性を持つ要素に適用する

cssで表現できる事がどんどん増えていますが、意外と知られてなかったり知っておくと便利な方法があります。

今回はその中の１つの、特定の属性を持つ要素にcssを適用する。

a[title] {
  color: red;
}

見慣れない書き方の人もいると思いますが、この指定の仕方だとtitle属性のあるaタグにcolor: redが適用されます。

自分も使う事がほとんどないので見慣れないですが、いざという時に知っておくと役に立つ事だと思います。

2017-08-08

sublimeText 関数の定義元を検索

使用している関数等の定義元のコードを探すときに便利なショートカットキーがありました。

検索したい関数名にカーソルを合わせて

cmd + shift + I

で、参照元のファイルが一覧で表示されます。

sublimeText3ではホバーさせるだけで表示されるようになっていたりしますが、参照元が多いと処理が重い場合がありフリーズしてしまう時もあるみたいなので

"show_definitions": false

で非表示にする事も可能です。

2017-08-04

chocotakaの日記

日々技術的な事で学んだ小さな事をを自分なりに書いていきます