タグ

HTMLに関するwackeyのブックマーク (50)

  • 非ウェブデザイナーに送るHTML&CSSガイド『Don’t fear the Internet』 | 100SHIKI

    あぁ、これはいいかも。 Don’t fear the Internetでは、HTMLCSSのざっくりとした仕組みを説明してくれているサイトだ。 HTMLのマークアップはどういう仕組みになっているのか、CSSでできる事はなにか、などを(英語だが)、デザイナーではない人向けに映像で解説してくれるのだ。 インターネットを恐れるな!というタイトルどおり、極めて初心者向けに作られている点に好感が持てる。 苦手意識を持っている人に映像で何かを説明する、というのは悪くないかもですな(ドットインストールもそうだが)。

    非ウェブデザイナーに送るHTML&CSSガイド『Don’t fear the Internet』 | 100SHIKI
  • わずか数秒で自分用のHTML5のテンプレート一式を作成するオンラインサービス -Initializr

    HTML5でサイトを作成する時に必要なHTML5の雛形、jQuery, Modernizrなどのスクリプト、CSSのリセットなど一式を自分用にカスタマイズして作成できるオンラインサービスを紹介します。 Initializr - Start your HTML5 project in 15 seconds! [ad#ad-2] InitializrでHTML5のテンプレート一式を作成する方法 HTML5用のテンプレート一式を作成するのは、わずか数秒で簡単にできます。 トップページにアクセスし、4つの選択項目から自分の必要なものをチェックし、最後に「Download」をクリックするだけです。 Initializr - Start your HTML5 project in 15 seconds! 選択項目のキャプチャ [ad#ad-2] Initializrで作成されるHTML5のテンプレート

  • リンク付き画像をリストに入れたときにできる変なマージンの回避法 World of granshe.

    画像をリストタグとaタグでマークアップしたものをブラウズすると、変な余白が開く現象があります。 長年(過去2回ですが)苦しんできたこの現象の原因と回避法が分かりました。のでメモ。 HTMLバージョンXHTMLTransitional、XML宣言あり。 タグの状況liタグの中にaタグを入れその中にimgタグを入れている。 CSSの状況ul、li、img共にマージンはゼロ。list-styleはnoneに。 表示: marginを0にしているにもかかわらず、Firefox、Safari、IEで変なマージンがでる。 1.プレーンな状態。 CSSに何も指定していない状態。 ちなみにOperaはこの状態でもマージンがないです。 2.CSSで、ul、li、a、imgタグのmarginを0に。 margin: 0;の指定があるにもかかわらず、変な余白が。 3.imgにdisplay: block;を指定

  • HTML5 API チェッカー - HTML5 チュートリアル - HTML5.JP

    HTML5 および、それに関連する仕様に規定された API がブラウザーに実装されているかをチェックします。 HTML5 HTML Canvas 2D Context Web Storage File API HTML5 Web Messaging Selectors API Level 1 Selectors API Level 2 Web Workers Geolocation API Server-Sent Events Element Traversal この API チェッカーは、厳密に、HTML5 仕様に準拠しているかどうかを調べているわけではありません。IDL 属性(プロパティ)については、得られたオブジェクトのコンストラクタ名または型を評価しています。メソッドについては、それが Function 型かどうかを評価しているだけです。そのため、実装していると結果が出たとしても、

  • IBM Developer

    IBM Developer is your one-stop location for getting hands-on training and learning in-demand skills on relevant technologies such as generative AI, data science, AI, and open source.

    IBM Developer
    wackey
    wackey 2011/06/24
    入門記事
  • 2130703450443574201?keyword=HTML5

    サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。

    2130703450443574201?keyword=HTML5
  • HTML5とは何かを簡単にまとめてみた

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog はじめに こんにちは。R&D統括部 制作部 ウェブデベロップメント部に所属しております。岡部和昌(@kzms2)と申します。 最近スマートフォンやタブレット向けのページを作成する機会が増えてきました。 なので、今回はちまたで大人気のHTML5について書きます。 若干今更な内容にも思えますが、あまりHTML5になじみがない方にもわかってもらえるような内容にしています。 HTML5の基概念や思想・実際の組み方というよりも、 HTML5で組むと今までと比べて何が違うのか などについて書いていきます。 なぜこれからHTML5なのか HTML4との違いがわからない HTML5を使う利点がわからない など疑問に思っている方はぜひ見ていた

    HTML5とは何かを簡単にまとめてみた
  • HTML5 のリセット・スタイルシート - html5doctor - HTML5.JP

    サイト内検索 この記事は、html5doctor に掲載されている記事「HTML5 Reset Stylesheet」を日語訳したものです。この記事では、HTML5 でマークアップしたページにも対応した、リセット・スタイルシートについて解説しています。最後に、HTML5 向けのリセット・スタイルシートもダウンロードできます。 原文タイトル HTML5 Reset Stylesheet 原文ページ URL http://html5doctor.com/html-5-reset-stylesheet/ 著者 Richard Clark 氏 原文投稿日 2009-07-27 一部、直訳ではなく意訳した部分がございます。原文と表現が異なることがございますので、ご了承ください。この語訳には、翻訳上の誤りがある可能性があります。したがって、内容について一切保証をするものではありません。正確さを

  • 【スマホ集中連載 第4回】 "HTML5とCSS3で何ができる?" 〜メリット・デメリットを徹底研究! : LINE Corporation ディレクターブログ

    ※この記事はChromeで見るのがおすすめです。 こんにちは。新規開発グループ ディレクター兼マークアップエンジニアの浜です。 スマホ連載の第4回目は、HTML5とCSS3という実装寄りの内容になります。とは言っても難しいコードはあまり出てきません。「HTML5とCSS3で何ができるのか」という事をメインに、知っておくと、構成書を作る時のアイディアベースになったりデザイナー・マークアップエンジニア(コーダー)と打ち合わせをする際に話しやすくなる内容をお送りします。 記事のアウトラインは以下です。 そもそも、HTML5とCSS3ってもう使えるの? HTML5とCSS3を使うメリットは? HTML5とCSS3で何ができるの? そもそも、HTML5とCSS3ってもう使えるの? 使えます。 (※ここから先は、その根拠について説明します。必要ない方は、次の章に飛んでしまっても構いません) 現在のスマ

    【スマホ集中連載 第4回】 "HTML5とCSS3で何ができる?" 〜メリット・デメリットを徹底研究! : LINE Corporation ディレクターブログ
  • サイトタイトル

    wackey
    wackey 2011/02/16
    Webテンプレート
  • HTML5で進化したフォーム機能 ここが違う!サンプルで見るHTML5(5)

    はじめに この連載では、今日のウェブ業界の流行語となっている「HTML5」をとりあげ、全6回に分けて、これまでの技術とどのような違いがあるのか、具体的にサンプルのコードを示しながら解説していきます。 過去の連載も読む 第1回:HTML5が注目を浴びる理由とは? 第2回:HTML4から変化したHTML5のマークアップ 第3回:HTML5で再定義された要素と属性 第4回:HTML5で実現できるマルチメディア系機能 新たに導入されたフォームコントロール これまでウェブにおける入力フォームコントロールは、非常に限られたものしかありませんでした。皆さんがよくご存じのテキスト(パスワード)入力フィールド、ラジオボタン、チェックボックス、セレクトメニュー、テキストエリア、ファイル選択です。お問い合わせフォームであれば、ほとんどのシーンで十分といえるでしょうが、ウェブアプリケーションにおいては、不足してい

    wackey
    wackey 2011/01/04
  • HTML5でつまずきやすいasideとsectionの使い方

    HTML5分かりにくいですよね。 初めまして。11月からME課で働いている久保田(@ta2_o2p)です。よろしくお願いします! 自分の仕事としては、携帯サイト中心にコーディングを行っているのですが、BMKidsの縁起物と笑い袋の紹介ページのコーディングを行ったり、他にも色々とPCサイトのコーディングをしています。 さて、実はカヤックで働き始めてHTML5を格的に触ったのですが、触れていくうちに「HTML5はややこしい所があるなー」と思い、この記事を書きました。 そういう訳で、HTML5でコーディングするに当たって間違いやすいポイントについて、書いていきたいと思います。 まずその前に 題とは反れますが、HTML5でコーディングするにあたって、押さえておきたいポイントを2つ書きます。 文字コードの指定はmeta要素のcharset属性で 今までは以下のようにmeta要素の中に長々と属性を

    wackey
    wackey 2011/01/04
  • サービス終了のお知らせ

    平素より「PHPプロ!」をご愛顧いただき、誠にありがとうございます。 2006年より運営してまいりました「PHPプロ!」ですが、サービスの利用状況を鑑みまして、2018年9月25日(火曜日)をもちましてサービスを終了させていただくことになりました。 サービス終了に伴いまして、2018年8月28日(火曜日)を持ちまして、新規会員登録ならびにQ&A掲示板への新たな質問、回答の投稿を停止させていただきます。 なお、ご登録いただいた皆様の個人情報につきましては、サービス終了後、弊社が責任をもって消去いたします。 これまで多くの皆様にご利用をいただきまして、誠にありがとうございました。 サービス終了に伴い、皆様にはご不便をおかけいたしますこと、心よりお詫び申し上げます。 件に関するお問い合わせはこちらよりお願いいたします。

  • http://www.rcdtokyo.com/ucb/contents/i000799.php

  • スクレイピングで作る“まとめサイト”

    どんなサイトでも、マッシュアップすることができる。APIが公開されていなくてもいい。新たなまとめサイトを構築し、情報付加価値を高めるための手法を解説しよう。 さまざまなコンテンツを組み合わせて、好みに合ったページ(サービス)を作り上げる「マッシュアップ」。これの最たるものは、コンテンツ提供者が公開する「WebAPI」の組み合わせで実現するものだ。 しかし、利用する仕様を整備して、効果的なデータだけをメータデータ配信するWebAPIは、まだそれほど普及していない。つまりマッシュアップというキーワードから流行っている兆しはあっても、対象として使うことができるものは、意外と少ない。思い出してほしい。 このような状況を打開するのが、HTMLコンテンツを抜き出して加工する「スクレイピングscraping)」という手法だ。 このオンライン・ムックPlus「まとめサイト2.0」では、例として「ITme

    スクレイピングで作る“まとめサイト”
  • Webスクレイピングを可能にするPHPライブラリ・htmlSQL

    htmlSQLはWebスクレイピング(部分的にHTML抽出)を可能にするPHPライブラリです。ソースが公開されていたのでご紹介します。 ※先日、お知らせさせて頂きましたように、この記事は僕が管理していた別のブログの過去記事を移行したもので正確性に欠ける可能性があります。何卒ご了承願います。 HTML内を部分的に取り出し、表示する事で、それを容易にするスクリプトがhtmlSQLというPHPライブラリです。DOM解析をSQL風に指示するらしい。 デモがありますのでご体感下さい。→htmlSQL – live example 以下のコードを使うようです。 <?php /* ** htmlSQL - Example 1 ** ** Shows a simple query */ include_once("../snoopy.class.php"); include_once("../htmlsq

    Webスクレイピングを可能にするPHPライブラリ・htmlSQL
  • HTMLをスクレイピングして解析(パース)する - まるさんかくしかく Tech学習と入門ログ

    Twitter Facebook B! Bookmark LINE Pocket Feedly HTMLスクレイピング(scraping)してあれこれとするとき、僕はずっと正規表現に頼っていたのですが、 ページの構造が変化するとすぐに使えなくなってしまうし、時間がかかる割りに退屈な作業なので何とかならないかなと思っていました。 PHPで探していたのですが、XML(とかRSS)をパースする関数やライブラリは、良く目にするものの、HTMLを処理できるものはなかなか見つかりませんでした。 以下は、PHP(とかRubyPerl)でHTMLスクレイピングしたりパースするための方法。 PHPスクレイピング&パース HTMLを整形式のXML文書に修正するPHPクラス HTMLを、整形式のXMLに変換してくれるライブラリ。PEARのXML_HTMLSax3が同梱されているので、これだけでちゃんと動

    HTMLをスクレイピングして解析(パース)する - まるさんかくしかく Tech学習と入門ログ
  • PHPでWEBページのタイトルを抜き出すサンプル | Creazy!

    いきなりPHPなネタですが。 マッシュアップ系のサービスを作っていると、指定されたURLのページタイトルを取得したい時が頻繁にあります。そんな時、いわゆるスクレイピングしてタイトルを抜き出すんですが、近頃たくさんでまわっているスクレイピングツールやら、ライブラリやら使わなくてもページタイトルくらいは抜き出せるんで、簡単なサンプルを書いてみる。 <?php /** * ページタイトルを取得する関数 */ function getPageTitle( $url ) { $html = file_get_contents($url); //(1) $html = mb_convert_encoding($html, mb_internal_encoding(), "auto" ); //(2) if ( preg_match( "/<title>(.*?)<\/title>/i", $html,

    PHPでWEBページのタイトルを抜き出すサンプル | Creazy!
  • PHPで外部HTMLから指定した文字列(タグ)だけを取り出してみる。

    があり、その中の<a href="link">文字列</a>だけを抜き出したかったのですが、 如何せん正規表現が調べても調べてもイマイチよくわからなくて、 preg_match('/<h2 class=\"leadContentTitle\">(.*)<\/h2>/i',$line, $match);とか preg_match_all関数とか,ereg関数とか色々やってみたんですが、 5時間くらい悩んだあげく、自分の望んでいるものが取得できなかった。 そこで、一度DOMにしたら、もしかしていけるんじゃないかと思い、 調べていたら、 PHP Simple HTML DOM Parser という優れものがありました!! 上記のサイトからsimplehtmldomのソースをダウンロードしてきて フォルダ内のsimple_html_dom.phpをサーバーにいれます。 んで、phpで //sim

  • Spidering Hacks

    毎日欠かさずチェックしているウェブページがありますか?ウェブ上のデータを二次利用したくありませんか?ウェブサービスを駆使してみたくないですか?そう思ったことがあるのなら、このを読むべきです。書は、ウェブを横断して情報を自動収集するプログラム、スパイダを自由自在に操り、目的の情報を取り出す方法を詳しく解説しています。また、各Hackを積極的に日語化し、訳書版独自のHackや日語処理の注意点(付録)を収録するなど、至れり尽くせりの内容です。スパイダ通のテクニックが満載! 関連ファイル サンプルコード 正誤表 ここで紹介する正誤表には、書籍発行後に気づいた誤植や更新された情報を掲載しています。以下のリストに記載の年月は、正誤表を作成し、増刷書籍を印刷した月です。お手持ちの書籍では、すでに修正が施されている場合がありますので、書籍最終ページの奥付でお手持ちの書籍の刷版、刷り年月日をご確認の

    Spidering Hacks
    wackey
    wackey 2010/10/26