タグ

HTMLとCSSに関するyoiITのブックマーク (26)

  • 法人向け研修トレーニングセンター レンタル教室 エムスクール | m-School

    m-School を終了させていただくことになりました この度、新型コロナウイルスの感染拡大による様々な影響を鑑み、 教室にて集合研修を行わないことを決定しました。 これに伴い、2020年6月30日(火)をもちまして、サービスを終了致しました。 長きに渡り多くのお客様にご利用いただきまして、誠にありがとうございました。 今後は、弊社が強みとするeラーニング事業、AI事業、学校教務支援システム事業等を より一層強化し、質の高い未来志向のICTソリューションを積極的に提供して参ります。 引き続きエスエイティーティー株式会社をお引き立ていただきますよう、 宜しくお願い申し上げます。 お問い合わせ先:エスエイティーティー株式会社 Copyright ©2020 SATT, Inc. All Rights Reserved.

    法人向け研修トレーニングセンター レンタル教室 エムスクール | m-School
    yoiIT
    yoiIT 2013/01/31
  • ウェブの進化

    現在のウェブは、動画、写真、インタラクティブなコンテンツをふんだんに使用したウェブページやウェブ アプリであふれています。一般的にあまり知られていませんが、これらすべてを可能にしているのがウェブ技術とブラウザの相互作用なのです。.� ウェブ技術が徐々に進化するにつれて、ウェブ デベロッパーは便利で実体験のようなウェブ体験の新時代を築くことができるようになりました。今日のウェブは、オープンなウェブ コミュニティが、HTML5、CSS3、WebGL のようなウェブ技術の定義を支援し、あらゆるウェブ ブラウザでサポートされるように絶え間なく取り組んできた成果といえるでしょう。. このタイムラインのカラーの帯は、現在使用されている多くの優れたウェブ アプリケーションを実現した、ウェブ技術とブラウザの相互作用を表現しています。. もっと見る

  • 激簡単にHTMLとCSSの共有が出来るリアルタイムオンラインエディタScrathpadが良い感じ! | バンクーバーのうぇぶ屋

    先日一通のメールが届きまして、ScrathpadというオンラインHTMLCSSエディターのローンチをお知らせするメールでした。 新サービスの公開しましたメールはよく届くので、オンラインエディタであればjsfiddleをよく使う僕にとっては得に期待してたわけでは無かったのが正直な所ですが、いやコレはもしかしたら乗り換えるかもと思ったので、まずは皆さんとも共有させて頂ければと思います! 似たサービスならCssizer.comやjsdo.itなんかが挙げられますが、僕のようなフロントエンド畑の人間であれば得に簡単なHTMLCSSを仲間内と共有したい機会なんか多いわけで、とにかく”ド”シンプルなオンラインエディターの方が嬉しいっちゃ嬉しいわけです。 そういう”ド”シンプル、”ド”簡単って意味では今回ご紹介するScrathpadというサービスはなかなか僕の希望を叶えてくれましたので、まずは超カン

    激簡単にHTMLとCSSの共有が出来るリアルタイムオンラインエディタScrathpadが良い感じ! | バンクーバーのうぇぶ屋
    yoiIT
    yoiIT 2012/12/18
  • コーディングしにくいデザインをHTMLとCSSのみで組んでみた(前編)

    コーディングしにくいデザインをHTMLCSSのみで組んでみた(前編) 2011-01-02 いつも通りデザイン系のサイトを見てると、 "Fresh Examples of Web Design and Interfaces" という記事を見つけました。 綺麗だけど、コーディングが難しそうなデザイン。コーダーにとってドSなデザインです。 そしてtwitterでこんなことをつぶやいてみました。 そしたら、"ぜひ"いう声があったので、ノリでやってみました。 実際にやってみるにあたり。 先ほどのサイトからデザインを選ぶことになったのですが、著作権的に問題があったので、先ほどのサイトからインスパイヤーしたデザインを自分で作ることにしました。 こんなんにした。 コーディングする前に コーディングの方法は様々あります。 自分の中で以下のようなルールを設けました。 ブラウザの対応はIE6-8, 最新モダ

    コーディングしにくいデザインをHTMLとCSSのみで組んでみた(前編)
  • 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 一部、直訳ではなく意訳した部分がございます。原文と表現が異なることがございますので、ご了承ください。この語訳には、翻訳上の誤りがある可能性があります。したがって、内容について一切保証をするものではありません。正確さを

  • あなたは何点?Webデザイナーのためのクイズサイト12

    2014年9月29日 便利ツール Webサイト制作や色彩感覚、タイポグラフィの知識をクイズ感覚で勉強できるサイトをまとめてみました。どれも短時間で楽しみながらできるものばかりなので、気軽に挑戦できますよ!Webデザインや制作の勉強中のあなたも、ベテランさんのあなたも、ぜひ試してみてください :) ↑私が10年以上利用している会計ソフト! 休憩時間にサクッと挑戦! 選択問題やドラッグ&ドロップでできるゲーム感覚な問題いろいろ! 1. HTML/CSS HTML5実力テスト HTML/CSSコース 「実力テスト」という名のクイズサイト。HTML/CSSコースではHTML5とCSSの基問題がクイズ形式で出題されます。制限時間は15分。「HTMLCSSを見てどのように表示されるか?」「smallタグは何を意味するか?」などなど、問題を解きながら勉強になります!

    あなたは何点?Webデザイナーのためのクイズサイト12
  • Webデザイナーでもできる、サイトのパフォーマンスをあげる5つの方法

    Webデザイナーでもできる、サイトのパフォーマンスをあげる5つの方法 2011-08-28 Webデザイナーが、Webサイトのパフォーマンスを重視する傾向はあまり無いように感じますが重要なことです。 Googleでは、0.5秒遅くなると、検索数が20%減少する amazonでは、0.1秒遅くなると、売り上げが1%減少する という報告もあるようです。Webサイトのパフォーマンスはコンバージョンにも影響する大切な部分。 今回はWebサイトのパフォーマンスを上げる方法を取り上げます。 パフォーマンスアップの前に 応答時間の限界 0.1秒までなら、結果はコンピューターではなく、ユーザーによって引き起こされたように感じる。 1秒までなら、"遅れている"と感じるが、ユーザーの思考は途切れずに、自由に動いていると感じる。 10秒までになると、ユーザーがコンピューターに振り回されている気持ちになり、ストレ

    Webデザイナーでもできる、サイトのパフォーマンスをあげる5つの方法
  • ふつうのユーザが知らないHTML5コーディングツール10選 - YAMAGUCHI::weblog

    はじめに こんにちは、Python界の情弱です。今日はChrome+HTML5 Conferenceのお手伝いに来てます。いままで全く触れてこなかった世界ですが、結構HTML5はXMLのようにセマンティクスに重点を置いてるんですね。CSS3も動的なエフェクトを簡単にかけられるようになってるし、とてもいいですね。 さて、YouTube Live Streamのお手伝いしながらRSS見てたら、ちょうど今日のテーマに沿ったエントリがdiggで紹介されてたので、翻訳しました。 10 Excellent HTML5 coding Tools Many Users Don’t Know About 10 Excellent HTML5 coding Tools Many Users Don’t Know About (オリジナル) HTML5はウェブサイトの作成方法を根から変えることになるでしょう。

    ふつうのユーザが知らないHTML5コーディングツール10選 - YAMAGUCHI::weblog
  • Example Domain

    We'll be back soon! Our site is currently undergoing maintenance. Please check back later.

    Example Domain
  • [JS]異なる高さのdiv要素の高さを揃えるだけのシンプルなスクリプト -Equalbox | コリス

    Equalbox.js デモページ [ad#ad-2] Equalbox.jsの実装 HTML 各div要素はjQueryのセレクタで指定できるように、idなどを指定します。 <div id="box-container"> <div id="box1" class="box"> <p>dsfsdfsdfsdf</p> <p>dsfsdfsdfsdf</p> <p>dsfsdfsdfsdf</p> <p>dsfsdfsdfsdf</p> <p>dsfsdfsdfsdf</p> </div> <div id="box2" class="box"> <p>dsfsdfsdfsdf</p> </div> <div id="box3" class="box"> <p>dsfsdfsdfsdf</p> <p>dsfsdfsdfsdf</p> <p>dsfsdfsdfsdf</p> <p>dsfsdf

  • インラインCSSで書かれたHTMLを一撃でCSSファイルと分割する「Cascader」

    とある理由から、インラインでCSSが書かれているHTMLを、綺麗にCSSファイルと分割させたいというときもありますよね。 しかし、これを手作業で進めるのはとても手間がかかり、0から作り直したほうが速いことがほとんど。 今回は、そんなときに一撃でCSSファイルと分割できるサービスをご紹介します。 組織のマインドマップツールをマインドマイスターにすべき理由 伸びてる産業、会社、事業を紹介しまくるStrainerのニュースレターに登録!! インラインCSSHTMLCSSファイルと分割する「Cascader」 「Cascader」は、インラインでCSSが書かれているHTMLファイルを、一発でCSSファイルと分割してくれるオンラインサービス。 ひとつひとつ分解しなくても、HTMLをコピペするだけで分割できてしまうのが非常に便利です。 HTMLタグを貼り付けるだけで分割 ↑たとえば、画像のようにイ

    インラインCSSで書かれたHTMLを一撃でCSSファイルと分割する「Cascader」
    yoiIT
    yoiIT 2011/05/05
  • float解除の決定版。clearfixを考えたら、進化した。

    現在この中でclearfixでよく使用されているプロパティは display:inline-block; height:1%(min-height:1%) zoom:1; でも良く考えたら、全て微妙です。 zoom:1はIEの独自仕様ですし、heightを使用する場合は、IE6,7に対応させるために2つのプロパティが必要です。 display:inline-blockもボックスの要素を変形させることになります。 hasLayoutのスイッチを見た時に、一番理に適ったプロパティはwidthかなと思いました。 子要素を囲む要素として、divやulなどデフォルトCSSがdisplay:blockのプロパティのものが多く、display:blockのプロパティの場合、width:100%で問題ないと思ったからです。 現在のブラウザ状況に適したclearfix 上記を踏まえ見直したclearfixが

    float解除の決定版。clearfixを考えたら、進化した。
  • HTML5+CSS3 入門

    Webを記述する言語の標準の現状 昨年度であれば、HTMLを記述する授業では自信をもって以下の基準を推薦していました。 HTML (文書の構造を記述する言語) – XHTML 1.0 もしくは XHTML 1.1 CSS (文書の体裁・デザインを指定する言語) – CSS 2 しかしながら、ここ数年で、とくに去年あたりから状況は大きく変動しつつあります。現状の変化を理解するには、ここに至るまでの歴史的な経緯について簡単に理解する必要があります。ここまでの経緯を整理した上で、将来の展望を探りたいと思います。その上で、この授業ではどのような基準にのっとって「正しい」ということを定義するのか決めていきたいと考えます。 HTML (Webサイトの記述言語) の標準化巡る闘争の歴史 AppleInsider: なぜ AppleHTML 5 に賭けているのか: ウェブの歴史 [Page 2] よ

    HTML5+CSS3 入門
  • HTML5+CSS3で実装された、さまざまなUIエレメントのコレクション

    パラグラフ・リスト・見出しなど [ad#ad-2] UIパーツの使い方 下記の3つのステップで、これらのUIを自分のページで利用できます。 IEへの対応 IEにHTML5を理解させるために、2つの重要なファイルを使用します。 <!--&#91;if IE&#93;> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <link rel="stylesheet" href="ie.css" type="text/css" /> <!&#91;endif&#93;--> CSSのインクルード スタイルシートファイルをインクルードしてください。もし使用するエレメントが限られているのであれば、その箇所のみで大丈夫です。 <link rel="stylesheet" href="reset.css"

  • HTML4から変化したHTML5のマークアップ ここが違う!サンプルで見るHTML5(2)

    CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

    HTML4から変化したHTML5のマークアップ ここが違う!サンプルで見るHTML5(2)
  • 無駄なdiv要素やclassだらけのマークアップから卒業する方法

    グリッドベースのレイアウトを作成すると、ついついdiv要素を多用してしまいがちですが、意味のあるデータにはそれに適した要素を使用し、無駄なdiv要素やclassだらけのマークアップから卒業する方法をWebdesigner Depotから紹介します。 Fight Div-itis and Class-itis With the 960 Grid System 下記は各ポイントを意訳したものです。 はじめに CSSのフレームワーク:960.gsの場合 classの乱用を避ける リスト要素の使用 画像とキャプションの使用 複数の見出しとパラグラフの使用 子要素のclassは親要素に はじめに 数年前までウェブページの設計はテーブルがスタンダードでした。そしてCSSはそれを大きく変え、今日ではCSSのフレームワークがウェブページの設計を容易にしてくれています。 しかしながら、このCSSのフレームワ

  • 知らない人は損してる?コーディングが3倍速くなるZen-Codingを導入してみた - EC studio デザインブログ

    最近になって急に盛り上がってきているZen-Codingをみなさんご存知ですか? Zen-CodingはHTML/CSSをショートカット+スニペットで簡略化してコードを書くことができるライブラリです。 独立したテキストエディタソフトではなく、既存のHTML/CSSエディタにプラグイン的に導入するものです。 Zen-Codingというのもがどういうもので、どんなすごいものなんだ、というのはこちらの動画を見てください。 ※音が出ますのでご注意ください。 Zen Coding v0.5 from Sergey Chikuyonok on Vimeo 一体何がおこわれているのか?という感じだと思われますが、今回の記事ではこのZen-Codingの導入方法と使い方の一例を紹介します。 Zen-Codingに対応しているエディタは色々あるのですが、今回は弊社の開発環境しているAptana Studio

  • CSS Nite LP9 連動 第2回コーディングコンテスト

    2007年5月に第1回目が開催されたコーディングコンテストの第2回を開催することになりました。 用意されたデザインを参加者がそれぞれ個々のスキルや考えに基づいてコーディングします。第2回は現在策定中であるHTML5+CSS3を利用し、テクニック、デザイン再現性、メンテナンス性の高さを競います。 このコンテストはCSS Nite LP9のイベントと連動しており、イベント当日に結果発表が行われます。 開催目的 これから現場で困るだろうHTML5+CSS3の技術を先取りして実装してみることで問題点を洗い出し知識として共有する。 この機会を利用してこれからのスタンダードを業界に示す。 参加・応募方法 参加するにはこのページ最下部にあるダウンロードリンクから必要データをダウンロードし、それを元にマークアップ、コーディングを行ってください。 完成したデータとprofile.txtをzip圧縮して c

  • Bos138 | Website Hiburan Game Online Scatter Hitam New Version

    Bos138 | Website Hiburan Game Online Scatter Hitam New Version Link Login Bos138 merupakan salah satu akses menuju platform terbaik yang menawarkan pengalaman bermain menyenangkan. Dengan berbagai jenis permainan menarik, para pengguna dapat menikmati hiburan berkualitas setiap saat. Keberagaman permainan seperti slot online, live casino, dan sportsbook memberikan banyak pilihan bagi para pemain.

  • css-lecture.com