『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。
帳票といえばPDFとして生成するのが一般的でしょうか? でも、2015年の今、あえてHTMLで描くのがホットです(個人的に)。ミリ単位で設定された高度な帳票も、CSSを駆使して簡単に作ることができます。業務システムでもモダンブラウザを選択することが増え、@pageなども積極的に使えるようになったこと、SPA(Single Page Application)の台頭、いろいろと条件が揃ってきました。 書いてたら結構長くなっちゃったので、さくっとコードだけ見たい方は、Paper CSSリポジトリをどうぞ。 はじめに HTML帳票のメリット 2015年現在、HTML帳票を選択する幾つかのメリットがあります。 ライブリロードで、リアルタイムなスタイル調整 バックエンドではなくフロントエンドで生成できる 前者は、gulpやGruntの普及で、CSSにしろHTMLにしろ、リアルタイムにプレビューできる環
HTTP2 時代のサーバサイドアーキテクチャフィードバック - Togetterまとめ のあたりで話していたことのまとめ。 補足 タイトルで「ES6 Modulesってconcatしないと動かないの?」と一部に誤解を与えてしまったようなので補足。ES6 Modulesがブラウザにネイティブ実装されたら、当然concatしなくても動きます。 ここで書きたかったテーマは「ES6 Modules + HTTP/2 + concat無し は ES6 Modules + HTTP/1 + concat と同等の速度で動作するのか」です。 追追記 (2016/01) kazuhoさんはh2oで Cache Aware Server Push という解決策を提案しています。 Jxckによる日本語解説記事: HTTP/2 Push を Service Worker + Cache Aware Server
どうも、シブタクです。 今の会社でSEOを担当しているのですが、内部SEOのチェックシートみたいのが無くて不便だったので作ってみました。 今は社内のメディアサイトしか見てませんが、これまで色んな企業の内部SEO分析を行ってきて、「ここはどこの企業さんも出来てないなー」という点を重点的にチェック項目に入れております。 割とざっくり作っているので、どういう意味かわからない~という方はお気軽にTwitterかこのページのお問い合わせから聞いてくださいませ。 解釈の違い、ご指摘なんかもありましたら喜んでお聞きします^^ ▼ぼくの記事はもう古くなってしまったので、さらに詳細に語られているこちらの記事を参考にしてください。 プロの技全公開!SEO対策チェックリスト102項目【PDF付】 ▼チェックシートのダウンロードはこちらからどうぞ。 内部SEO分析チェックシート 色付けとかしてご使用くださいな。
written by DEFGHI1977 [重要] auonenetホームページ公開代理サービス終了に伴い、公開済みの各種ドキュメントをxdomainサーバーに移行しました. 旧アドレスへのアクセスは本ページにリダイレクトされます. お手数ですがブックマークやリンクなどのURL参照先の更新・変更をお願いいたします. You were redirected from old "dion(auonenet)" page which had been out of service. Please update URL settings of your bookmarks, links or more. Thank you. 突貫工事で作ったため, 抜けがあるかもしれません. ゲームツール等(game tools) 悪魔城ドラキュラHoD(Castlevania HoD)・アイテム早見表(Cas
先日 Firebug Lite ブックマークレットを公開しましたが、動的生成した IFRAME に HTML を流し込むとブラウザが読み込み状態のままになってしまう(ロード中アニメーションなどが再生されっぱなしになる)という問題がありました。 IFRAME の動的生成はいろいろと応用範囲が広いので、なんとかこの問題は解決しておきたいところです。そこでいろいろと試行錯誤して、なんとか回避方法を見つけることができました。本日はそれをご紹介しようと思います。 さっそく種明かししてしまいましょう。実は答えはいとも簡単でした。 document.write で HTML を流し込む前後で document.open と document.close をきちんと呼ぶ必要があるようです。こんな感じですね。 var iframe = document.createElement('IFRAME'); do
The Polymer library is in maintenance mode. For new development, we recommend Lit. The Polymer library provides a set of features for creating custom elements. These features are designed to make it easier and faster to make custom elements that work like standard DOM elements. Similar to standard DOM elements, Polymer elements can be: Instantiated using a constructor or document.createElement. Co
Extensible Code Editor CodeMirror is a code editor component for the web. It can be used in websites to implement a text input field with support for many editing features, and has a rich programming interface to allow further extension. This is a CodeMirror field, configured for editing JavaScript code. Features Accessibility Works well with screen readers and keyboard-only users. Mobile Support
HTML5/CSS3などのフロントエンドもWeb上の資料が充実しすぎていて、ついつい今までなんとなく作って体系的な知識が不足していました。知れば知るほど奥が深いフロントエンド・コーディングを少し手も効率的にするために、いくつか書籍を購入したり、ネット上の資料を読み込んでみたので、備忘録がてらまとめていきます。 (02/05 20:10) 定期見直し 🎂 [Style Guide]「Google HTML/CSS Style Guide」の和訳 Googleが作ったStyle Guide『Google HTML/CSS Style Guide』を和訳していただいた『Google HTML/CSS Style Guideを適当に和訳してみた』。HTMLのベーシックな書き方から、CSSの書き方まで一貫している。個人的にはCSSのプロパティがアルファベット順というのは合理的だと思う! 🐰 [S
getComputedStyle とは!? ある要素にどんなスタイルが当たっているかを計算してくれる。便利な関数。 使いかたはめっちゃ簡単! var style = getComputedStyle(element, ''); alert(style.fontSize); // 14px alert(style.color); // rgb(0, 0, 0) ちなみに第二引数は疑似要素の style を取りたい場合に使います。通常は空文字列でいい。 でも、 getComputedStyle はこのままでは IE, Safari では動かない。 Safari では window(グローバル領域) に getComputedStyle は定義されてなくて、 document.defaultView だけに getComputedStyle が定義されている。 ちなみに、 Firefox, Op
<div class="deck-container on-slide-1"> <section class="slide deck-previous"> <h1>My Presentation</h1> </section> <section class="slide deck-current"> <h2>Slide Header</h2> <p>Here is a list of points:</p> <ul> <li>Point 1</li> <li>Point 2</li> <li>Point 3</li> </ul> </section> <section class="slide deck-next"> <h2>Another Slide</h2> <blockquote cite="http://example.com"> <p>Lorem ipsum dolor sit
Hello Therereveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. Vertical SlidesSlides can be nested inside of each other. Use the Space key to navigate through all slides. Basement Level 1Nested slides are useful for adding additional detail underneath a high level horizontal slide. Basement Level 2That's it, time
For full functionality of this site it is necessary to enable JavaScript. Here are the instructions how to enable JavaScript in your web browser.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く