Movatterモバイル変換


[0]ホーム

URL:


はてなブックマークアプリ

サクサク読めて、
アプリ限定の機能も多数!

アプリで開く

はてなブックマーク

タグ

関連タグで絞り込む (33)

タグの絞り込みを解除

htmlに関するKoshianXのブックマーク (59)

  • そろそろ真面目に、HTMLで帳票を描く話をしようか - Qiita

    帳票といえばPDFとして生成するのが一般的でしょうか? でも、2015年の今、あえてHTMLで描くのがホットです(個人的に)。ミリ単位で設定された高度な帳票も、CSSを駆使して簡単に作ることができます。業務システムでもモダンブラウザを選択することが増え、@pageなども積極的に使えるようになったこと、SPA(Single Page Application)の台頭、いろいろと条件が揃ってきました。 書いてたら結構長くなっちゃったので、さくっとコードだけ見たい方は、PaperCSSリポジトリをどうぞ。 はじめにHTML帳票のメリット 2015年現在、HTML帳票を選択する幾つかのメリットがあります。 ライブリロードで、リアルタイムなスタイル調整 バックエンドではなくフロントエンドで生成できる 前者は、gulpやGruntの普及で、CSSにしろHTMLにしろ、リアルタイムにプレビューできる環

    そろそろ真面目に、HTMLで帳票を描く話をしようか - Qiita
    KoshianX
    KoshianX2015/10/14非公開
    CSS表現力が上がってきて印刷にも本格的に使えるようになりつつあるのか。バックエンドに生成したHTMLツリーなげてPDFもらうとかもできそうだなあ
    • <input type=image>で送信すると、X,Y座標が送信されるので、調べたら闇だった - それマグで!

      複数に分割されたログインID入力が・・・ タイムズカープラスのログインを、ブラウザが学習しない。 Opera(Presto)だと複数にわかれたIDを学習してたのに、Opera(blink)になってから学習しないので、もう面倒だから拡張機能で対応しようとした。 フォームの値をJavaScriptで送信しようとしてハマったのでメモ。 スクリーンショット 2014-12-05 14.38.08 form.submit でログイン失敗する HTTPのリクエストヘッダを見ていると input に存在しない値を送信している模様。 tpLoginForm:doLoginForTp.x:132 tpLoginForm:doLoginForTp.y:14 どこから出てきた、この値は。と調べてて見つけた。 input type ="image" はクリック位置を送信する模様 知らなかった。X,Y座標を送信する

      <input type=image>で送信すると、X,Y座標が送信されるので、調べたら闇だった - それマグで!
      KoshianX
      KoshianX2014/12/06非公開
      クリッカブルマップとはまた違うのか
      • JavaScriptで変な形のクリック領域を作るとき、svgが便利 - MANA-DOT

        昨日のVieraのリモコン、リモコンを作りたかったのもあるけど、svgJavaScriptを組み合わせた簡単なプログラムを試しに書いてみたかったというのがあります。html5ではsvghtml中に埋め込んで、更にそのsvgcssでスタイルを当てたり、JavaScriptでいろいろやったり出来ます。 この時、要素のクリック領域は要素の形そのままなので、昨日のリモコンのような変な形のクリック領域を簡単に作ることが出来ます。 以下の画像の色のついた箇所にマウスを乗せたりクリックをしたりしてみてください。 100km 画像はWikipediaより。 上記の画像は、クリックできる箇所に .svg-area というクラス名と、data-name属性に市町村の文字列が入っており、以下の様なcss/jsによって動作を実現しています。 path.svg-area { cursor: pointer;

        JavaScriptで変な形のクリック領域を作るとき、svgが便利 - MANA-DOT
        • 入力フォームを数字キーボードに設定するには? | Webサイト開発

          フィーチャーフォンでは、フォームでテキストを入力する際の文字入力モードをHTMLの属性(istyle=”4″など)で指定できる。文字入力モードは「ひらがな」「カタカナ」「英字」「数字」のように文字種を指定できるから、入力モード切替が煩わしい携帯では切り替えの手間が省け、ユーザビリティが良くなる。 ではスマートフォンは入力モードに対応しているか?いや、Androidに搭載されたブラウザは標準HTML準拠だからダメに違いない・・・。そう思ってあきらめていた。 が、調べてみるとAndroidブラウザでも数字モードに設定する方法があった。 関連記事: maxlengthで半角文字数で制限するには?iPhone向けSafari、HTML拡張属性を使いこなす 画像をピッタリ横並び表示させるテクニック スマートフォンのラジオボタンを使いやすいサイズにするには? スマホ向けページャデザイン 3選 And

          入力フォームを数字キーボードに設定するには? | Webサイト開発
          • 自動車免許.club - このウェブサイトは販売用です! - 自動車免許 リソースおよび情報

            This webpage was generated by thedomain owner using SedoDomain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor doesit constitute or implyits association, endorsement or recommendation.

            KoshianX
            KoshianX2013/05/23非公開
            互換性の無さはMozillaとWebKitがうまく連携してくれるといいんだが、採用バージョンの違いで出ちゃうのは各社のアップデートに期待するしかないのか
            • 結局どうすればいいの? - Dive Into HTML5

              Translation of: What DoesIt All Mean? - Dive IntoHTML5 Diving In The Doctype The Root Element The <head> Element Character Encoding Friends & (Link) Relations rel = stylesheet rel = alternate Other Link Relations inHTML5 New Semantic Elements inHTML5 A long digression into how browsers handle unknown elements Headers Articles Dates and Times Navigation Footers Further Reading 訳注 Diving In この章で

              KoshianX
              KoshianX2011/11/21非公開
              HTMLのいろいろ。IE Hackェ……
              • EmacsWiki: Zen Coding

                Zen Coding refers to a neat way to write markup quickly. The followingblogs provide summary and examples: http://www.456bereastreet.com/archive/200909/write_html_and_css_quicker_with_with_zen_coding/http://mondaybynoon.com/2009/08/17/the-art-of-zen-coding-bringing-snippets-to-a-new-level/ (skip the cruft about snippets)EmmetZen Coding has been renamed toEmmet and includes an expanded feature set

                • マイクロソフトが戦略変更。HTML5が唯一のクロスプラットフォーム、SilverlightはWindows Phone 7のプラットフォームに

                  「私たちの戦略をシフトした」と、マイクロソフトのサーバー&ツール ビジネス担当 プレジデントのボブ・マグリア氏が、ブログAll AboutMicrosoftのエントリ「Microsoft: Our strategy with Silverlight has shifted」のインタビューで語っています。 新たな戦略では、SilverlightはWindows Phone 7のアプリケーション開発プラットフォームとなり、HTML5がiPhoneなどモバイルも含むクロスプラットフォームに位置づけられると説明しています。 Publickeyでは以前から「iPhone OSのFlash排除で、HTML5/JavaScriptだけがマルチプラットフォーム対応として残った」と、HTML5が唯一のクロスプラットフォームとなり、マイクロソフトのSilverlightやアドビスシテムズのFlashが目指し

                  マイクロソフトが戦略変更。HTML5が唯一のクロスプラットフォーム、SilverlightはWindows Phone 7のプラットフォームに
                  KoshianX
                  KoshianX2010/11/02非公開
                  うし、MSもAdobeもHTML5対応の方向か。
                  • W3C - 『HTML 5 differences from HTML 4』日本語訳 - HTML5.JP

                    一部、直訳ではなく意訳した部分がございます。原文と表現が異なることがございますので、ご了承ください。この日語訳は、私が理解を深めるために、自分なりに日語化したものです。語訳には、翻訳上の誤りがある可能性があります。したがって、内容について一切保証をするものではありません。正確さを求める場合には、必ず原文を参照してください。当方は、この文書によって利用者が被るいかなる損害の責任を負いません。もし誤りなどを見つけたら、当サイトのお問い合わせより連絡いただければ幸いです。 原文URL:http://www.w3.org/TR/2011/WD-html5-diff-20110525// 原文タイトル:HTML 5 differences fromHTML 4 - W3C Working Draft 25 May 2011 翻訳日:2011/05/26 最終更新日:2011/05/26

                    • Impact HTML5 Game Engine

                      Sorry, the ImpactHTML5 Game Engine is not ready yet. You can enter youremail address to get notified whenit's ready. Youemail address will only be used once and only for this purpose. Hey there,it looks like you're usingMicrosoft's Internet Explorer.Microsoft hates the Web and doesn't supportHTML5 :( To play this game you need agood Browser, like Opera,Chrome, Firefox or Safari.

                      KoshianX
                      KoshianX2010/10/13非公開
                      ほう。すでにコードが出てるAkihabaraと比べてどうなのかなhttp://www.kesiev.com/akihabara/
                      • HTML5でWebページをマークアップするための基礎知識

                        最近よく目にする「HTML5」という言葉。JavaScriptAPICSS3、SVGなどを含め、急速な広がりを見せつつある「HTML5」の基礎を学べる入門連載です。「HTML5を使うと、何ができるのか」「それを実現するには、どのようなプログラムを書いたらいいのか」をお届けします 5からHTMLの“文法”が変わるって知ってた? 連載第1回の「Webの3つの問題を解決する「HTML5」とは何なのか」では、HTML5という技術革新の意義、そして連載の大まかな流れについてお話ししました。連載第2回である今回は、HTML5のマークアップを行うための基礎知識についてお話しします。HTML5では、その文法が大きく変化しました。「HTMLが、どれほど普及しているか」「根底となる“文法”が変わってしまったら、どれほどの影響があるか」に想像が及ぶ方であれば、非常な驚きと不安を抱かれるかもしれません。

                        HTML5でWebページをマークアップするための基礎知識
                        • HTML5 World Tour

                          $200K 1 10th birthday 4 abusive ads 1 abusive notifications 2 accessibility 3 adblockers 1 adblocking 2 advanced capabilities 1android 2 anti abuse 1 anti-deception 1 background periodic sync 1 badging 1 benchmarks 1 beta 83 better ads standards 1 billing 1 birthday 4blink 2 browser 2 browser interoperability 1bundles 1 capabilities 6 capable web 1 cds 1 cds18 2 cds2018 1chrome 35chrome 81

                          HTML5 World Tour
                          KoshianX
                          KoshianX2010/09/22非公開
                          でっかくやるんだなあイベント。バンコクのは登録しておいた
                          • HTML5がラストコール(最終草案)へ、工程表を発表

                            W3CでのHTML5の議論が、ラストコール(最終草案)に向けて具体的に動き始めました。 W3CのHTMLワーキンググループでチェア(議長)の一人であるMaciej Stachowiak氏は、9月7日付けでHTMLワーキンググループのメーリングリストに「Timeline to Last Call」というメールをポストし、ラストコールに向けた工程表を明らかにしました。 Timeline to Last Call fromMaciej Stachowiak on 2010-09-08 ([email protected] from September 2010) これによりHTML5について機能追加や変更の議論が収束することになります。 ただし、W3CではCanvasやWeb Storageなどの多くの機能がHTML5の関連仕様として分離され議論されているので、それらについての議論は継続するは

                            HTML5がラストコール(最終草案)へ、工程表を発表
                            KoshianX
                            KoshianX2010/09/13非公開
                            来春にはリリースか。胸が熱くなるな。
                            • iPadでHTML5でWebアプリを作ってみました。

                              こんばんは。LatLongLabの河合(@inuro)です。 ようやくiPadが日でも発売されましたね。入手された方もたくさんいらっしゃることかと思います。 ヤフーではこのiPad国内発売にタイミングを合わせ、Yahoo!ラボで「yubichiz」というiPad専用の地図Webアプリを公開しました。Yahoo!ラボ - yubichiz(ゆびちず) 詳しい機能はリンク先ページを見ていただくとして、 地図に書かれた文字(大塚家具、とか紀伊國屋書店、とか)をタップするだけでその店舗の詳細情報が表示されます 地図を指でなぞるだけで、なぞったラインの距離を測定できます 同様に地図を指でなぞるだけで、道沿いのお店を検索できます といった特徴があります。 またyubichizは、App Storeからダウンロードするいわゆる「アプリ」ではなく、HTML5を用いてiPadのSafari上で動作するW

                              iPadでHTML5でWebアプリを作ってみました。
                              • SVG vs. Canvas? « HTML5.JP ブログ

                                先日のHTML5 3Days のTech Talk で Canvas とSVG の違いを簡単に説明しましたが、これを深く追求してレポートされている方がいらっしゃいましたので紹介します。 2009 年 10 月にカルフォルニアで開催されたSVG Open 2009 で、ヘルシンキ大学の Samuli Kaipiainen 氏と Matti Paksula 氏によるプレゼンテーション SVG vs. Canvas on Trivial Drawing Application で、SVG と Canvas の特性の違いや、それらを組み合わせる方法などが解説されています。このプレゼンテーションの内容は、こちらの資料に詳しく説明されています。 このプレゼンテーションを要約すると、次の通りです。 ピクセル描画では Canvas が優れている。SVG でもできないことはないが、ピクセルごとにノー

                                • Opera News

                                  Desktop Opera One updates with new webpage Translator and improved Split Screen July 3rd, 2025 We're introducing a new built-in webpage translator to Opera One following yourrequests. We're also adding improvements to Split Screen. Mindfulness, OperaAir OperaAir’s redesigned Boosts now smoother, more intuitive June 4th, 2025 Hey all, Today we have another update for OperaAir, our browser built

                                  • Akihabara

                                    Credits formusic artists are on staff rolls of each games and here. Feelbrave? So you're ready for the Dark side of Akihabara with experimental material! Uh-uh-uh!HTML5 is my Arcade. Akihabara is a major Tokyo shopping area for electronic, computer, anime, and otakugoods. You can find any sort of old & new videogames, starting from the 8-bit era to modern motion-sensing videogames. But is also

                                    KoshianX
                                    KoshianX2010/04/23非公開
                                    これはすげーな。あとでじっくりコード読もう
                                    • Rails で W3C-DTF - elm200 の日記(旧はてなダイアリー)

                                      このサイトによれば、W3C-DTF とは、「1997年9月に W3C の会員企業である Reuters Limited が W3C に提出した ISO 8601の日付形式のプロファイル」で、正確には W3C の正式規格ではないとのこと*1。しかしRSS 方面では幅を利かせているらしく、この validatorは日付の形式が違うと文句をのたまう。Ruby でお手軽に W3C-DTF 形式の日付を出してくれるソースコードをネットで探していたのだが、見つからなかったので自作してみた・・・と書きかけたのだが、実はRails が Time クラスを拡張していることを発見。 訂正:moro さんにご指摘いただきました。実はRuby の time ライブラリでの拡張だそうです。謹んで訂正します。 Time.now.iso8601 # => "2008-07-22T14:20:00+09:00"

                                      Rails で W3C-DTF - elm200 の日記(旧はてなダイアリー)
                                      KoshianX
                                      KoshianX2010/04/17非公開
                                      HTML5のtime要素などに使用するW3C-DTF形式を取得する方法。Hoge.updated_at.iso8601 とか書いてやるだけでいい……
                                      • はてなブログ | 無料ブログを作成しよう

                                        【献血デビュー】体重が少し足りず400ml献血はできなくとも、献血ルームでの成分献血ならできたぞ、という話 いきさつ 2025年の抱負として「400ml献血をできるようになる」を掲げてから、冬を越し春が過ぎ夏が終わ………なかなか終わらないな……8月も終わろうとしている。記事を書いた頃の体重からは1kgぐらい増えたところだ。 夏バテなんてどこ吹く風とばかりに、ここ数週間は私の…

                                        はてなブログ | 無料ブログを作成しよう
                                        • Comparison of browser engines (HTML support) - Wikipedia

                                          This article is being considered for deletion in accordance withWikipedia's deletion policy. Please share your thoughts on the matter at this article's deletion discussion page. Feel free to improve the article, but do not remove this notice before the discussion is closed and do notblank the page. For more information, read theguide to deletion. Find sources: "Comparison of browser engines" HT

                                          お知らせ

                                          公式Twitter

                                          • @HatenaBookmark

                                            リリース、障害情報などのサービスのお知らせ

                                          • @hatebu

                                            最新の人気エントリーの配信

                                          処理を実行中です

                                          キーボードショートカット一覧

                                          j次のブックマーク

                                          k前のブックマーク

                                          lあとで読む

                                          eコメント一覧を開く

                                          oページを開く

                                          はてなブックマーク

                                          公式Twitter

                                          はてなのサービス

                                          • App Storeからダウンロード
                                          • Google Playで手に入れよう
                                          Copyright © 2005-2025Hatena. All Rights Reserved.
                                          設定を変更しましたx

                                          [8]ページ先頭

                                          ©2009-2025 Movatter.jp