2017-11-01から1ヶ月間の記事一覧
chromeのディベロッパーツールでCoverage機能を知っているでしょうか？？ chrome 59 から使えるようになった機能ですので、使いたい場合はバージョンUPをしましょう。 js and css coverage どのような機能かというと、使用・不使用のcssとjsのコードを表示し…
お勉強させていただきやす
picture要素とは HTML5.1で新しく加わった要素の一つで、モバイル/タブレット/パソコンと画面解像度に最適化された画像を設定するのに javascriptやcssでごにょごにょする必要があったのを解決する、とても便利な要素です。 使ってみよう <picture> <source media="(min-width: 700px)" srcset="sample1.jpg"> <source media="(min-width: 300px)" srcset="sample2.jpg"> <img src="default.jpg"> </picture> このように、p…
circleciでgithubと連携させてビルドを走らせる事ができます。 自サービスではあるブランチ名でpushすると、ciが走りビルドが完了すると開発環境を更新されるような設定になっています。 ただciを走らせたくないタイミングが一時的にありました。 ci上からru…
はじめに 自サービスがのちにAMP対応しようとしていたのと、AMPに合っているサービスということもあり AMPとはどうゆうものなのかという所から、AMPを実際に実装していく所までやっていきました。 AMPの目的がモバイルでの高速表示なので、様々な制限の中ペ…
html宣言 <html ⚡ lang="ja"> のように記述する。 style指定 <style amp-custom> body { width: auto; margin: 0; padding: 0; } </style> cssは極力処理を早くするために外部ファイルを読み込むではなくstyle amp-customで囲う。 img指定 <amp-img src="sample.jpg" layout="responsive" width="266" height="150"></amp-img> width/heightはレンダリングを少しでもスムーズにするために指定</html>…
