ヒトリデハキケンジャ GitHubのコーディング規約を授けよう
コードが適切に整形されているかどうかはデザイナーやエンジニアなどコードを書く人にとっては日常的な課題のひとつです。プログラミング言語やツールに応じて様々なコーディング規約によって正しいコードの書き方が定義されていますが、GitHubが社内で利用しているコーディング規約を「スタイルガイド」としてサイト上で公開しています。 このスタイルガイドは5個のセクションに分かれています。 概要 スタイリング(CSS) マークアップ(HTML) ビヘイビア(JavaScript) Ruby GitHubということで様々なRubyのツールとの組み合わせが前提になっている部分もありますが、CSSに対しての規約は例えば下記のようになっています。 インデントはスペース2つのソフトタブを使う プロパティ宣言の:の後にはスペースを空ける 宣言の{の前にはスペースを空ける カラーコードはrgbaを使わない場合は数字で指
How To Enable HTML5 In Chrome | Robots.net
Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest technologies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp
Mozilla の Web O'(pen) Wonder
驚きの連続 ウェブの見事なデモを探検してください! 高機能なブラウザで実現されるすばらしい発明の世界を! デモを投稿!
[css] @importを使うべきでない理由
実は以前に別の場所でも書いたのですが、今回Google Page Speedの方でも少しだけ触れられていたので、改めてまとめ。 自分でも経験があることなのですが、開発をやっているとどうしても、構造をモジュール化して複数のファイルに分割して管理したくなります。 StyleSheetにおいても同様で、プレゼンテーション層のコンポーネントにあわせてCSSを用意し、ページ構成にあわせて取り込むようなことをやりたくなるでしょう。 しかしその際、@import構文を使うのはパフォーマンスと挙動の両方に有害である可能性が高いと、「」の著者としても知られるSteve Souders氏が警鐘を鳴らしています。 使うべきでないポイント @importは、大きく分けて2つの観点で「使うべきでない」とされています。 ひとつは、パフォーマンスの問題。StyleSheetはほぼ全ての主要ブラウザでパラレルロードがサポ
[CSS]外部スタイルシートの指定は@importとlinkでどちらがいいか
外部スタイルシートの指定は@importとlinkでどちらがいいかと、書籍「ハイパフォーマンスWebサイト ―高速サイトを実現する14のルール」の@importはパフォーマンスに悪影響を与えることについてのフォローアップを紹介します。 don't use @import 内容は、IEでは@importで外部スタイルシートを指定すると、パフォーマンスに悪影響を与えるので使用しないでください、というものです。 下記は、外部スタイルシートを@importとlinkを組み合わせて、それぞれのパフォーマンスを比較したもので、キャプチャはそのサイトのものと、参考に当環境でIE7/Fx3(XP)を検証したものです。 @import @import 2つの外部スタイルシートを@importで指定。 <textarea name="code" class="html" cols="60" rows="5">
Perlで作るCGI講座 - 入力フォーム編（GETとPOSTデータを受け取るには） - futomi
CGI を作成する上で、テキストボックスやラジオボタンなどのフォームに入力、選択された状態を取り込むことは避けてとおれません。 ここでは、入力フォームのデータをどのように CGI で取り込むのかを紹介します。 初心者向けに冒頭でで GET と POST についても解説します。 目次 HTTP メソッド フォームデータをサーバーに送信する方法 (メソッド) には GET メソッドと POST メソッドがあります。 HTTP プロトコルでは、他に PUT メソッドや DELETE メソッドも規定されていますが、 ブラウザーで利用できるのは GET メソッドと POST メソッドの 2 つだけです。 GET メソッドやは、HTTP/0.9 から規定されており、当時ではデータをサーバーに送信する唯一の手段でした。 今でもデータ送信手段として使われていますが、送信データが URL としてブラウザーの
ホームページ作成 タブメニューのいろいろ（一覧） - WEBサイト作成 フリー素材コード の1uphp.com スタイルシート,htmlやFirefox,Operaなどのブラウザの表示結果まで。
タブメニューのいろいろ（一覧） タブメニューの作り方を、スタイルシートを中心にいろいろな実現パターンを実際に見てみましょう。 多くのやり方があると思いますが、下記がパターンの一覧です。 複数のリンクをスタイルシート（２色で表現）でタブメニュー化 上記のもを複数色でタブメニュー化 さらに、上記の背景に角丸の画像を設置してタブメニュー化 リンク自体に画像を使用してタブメニュー化 立体的な画像を使用してタブメニュー化 上記の画像を使用する場合をテーブルでレイアウトしてタブメニュー化 １～５の方法は下記のリンクをスタイルシートにて設定してます。 【重要】 『タブ』の色と同色の帯びを、その直下に設置する事が重要です。 これは、２色の場合でも、複数色でも、画像を使用する場合でも共通に重要な事です。 （『現在訪問しているページが、メニューのどこと一致しているか。』を表現する為です。） 現在訪問しているペ
Professional lorem ipsum generator for typographers
Lorem Ipsum: Quality typographic filler text for webmastersThe dummy copy at this site is made from a dictionary of 500 words from Cicero's original source and the text fragments traditionally added. We use a lexical scheme to ensure a grammatically correct look and feel. This avoids repetitions, unintentional humor, and structures considered non-idiomatic for standard lipsum filler text. This gen
HTML入力フォーム
WebブラウザにHTMLファイルを表示させる通常の「静的なページ」に対し、メールフォーム、掲示板、ブログなどのようにWebブラウザから入力された要求に対して Webサーバ側でプログラムを呼び出し処理した結果を返すしくみを、CGI （Common Gateway Interface ）といいます。このようなページを、 「動的なページ」といいます。 この動的なページには、サーバ側でPerl、PHPやC言語などのプログラムが使われたり、JavaScript のようにブラウザ側で処理します。 このとき WebサーバのCGI プログラムに渡すパラメータは、テキストボックスやチェックボックスなどのフォーム部品で指定します。これらのデータを入力するためのユーザインターフェース 部分を、HTMLでは<form>要素で記述します。 form 要素の構造 form 要素は、<form>～</form>で一つの
基本的なフォーム -- ごく簡単なHTMLの説明
この例をもとに、HTMLのフォームを構成する要素を順番に説明していきます。この例のHTML全体は、本章の最後で改めて紹介します。 フォームの基本枠組み データを送信するためには「何を」「どこに」「どうやって」送るかを示さなければなりません。フォームはこのための手段を提供します。 HTMLのフォームは、データを入力するための手段（コントロールと呼びます）と、それに関するラベルや説明から構成されるひとまとまりのセクションです。「何を」送信するかを示すためにこのセクションの範囲を明示し、「どこに」「どうやって」送信するかを設定します。この枠組みを提供するのがform要素です。 form要素の構造 form要素タイプは2つの主要な属性を持ちます。ひとつは「どこに」、つまりデータを受け取るプログラムを指定するaction属性、もうひとつが「どうやって」、つまりデータの送信方法を指定するmethod属
複雑な表（テーブル）の作り方 colspan rowspan - ホームページの作り方 - MB-Support パソコン初心者のサポートページ
複雑な表（テーブル）の作り方 colspan rowspan 表（テーブル）のセルを空白にする方法は、セル内で全角スペースを入れれば良いだけですが、2 つ以上のセルを合体させたると、より見やすくテーブルを構成する事ができます。 特定の行だけ、縦の仕切り線を破る場合は <td> に colspan="またがるセルの数" を挿入します。 HTMLソース(メモ帳) <html> <head> <title>題名</title> </head> <body> <table border="1"> <tr><th colspan="2">ホームズの思い出</th></tr> <tr><td width="200">白銀号事件</td><td width="200">黄色い顔</td></tr> <tr><td>株式仲買店員</td><td>グロリア・スコット号</td></tr> </table>
サーバー不要で保存できる「Web Storage」の使い方 (1/5)
HTML5とともにW3Cで標準化が進められているDOM APIの1つに「Web Storage」があります。Web StorageはCookieと同様にローカルディスク上にデータを保存する機能で、Cookieに比べて「有効期限がない」「データサイズの制限がない」といった特徴があります。ローカル上に永続的にデータを保存できるので、フォームの入力内容の保存やゲームのプレイ履歴の記録、各種サービスの状態保存など、などさまざまな用途に利用できます。 Web Storageにはローカルストレージとセッションストレージがあり、永続的にデータを保存する場合はローカルストレージを、ブラウザーを開いている間の一時的な保存であればセッションストレージを使います。ローカルストレージ、セッションストレージとも同じメソッドを持ち、記述方法に違いはありません。 今回のJavaScriptラボは、HTMLフォームに入力
IT技術・ソフト開発メモ帳 AjaxとServletの非同期通信(Ajax.Request)方法
Ajaxからprototype.jsのAjax.RequestでServletを呼び出し、XMLの形式で非同期通信を行うための簡単なサンプルスクリプトを掲載します。 尚、当スクリプトはprototype.jsのJavaScriptライブラリが必要となりますので、以下のサイトからダウンロードする必要があります。 http://www.prototypejs.org/ 呼び出される側のServletは以下のようになります。実際はDBに接続後、そのデータをXML形式に変換してresponseに返す必要があるのですが、このソースでは簡単なテストを行うためにハードコードしてデータを返しています。 AjaxTest.java //J2SE import java.io.IOException; import java.io.PrintWriter; //J2EE import javax.servle
jQueryを使い始めたときに感じる13の疑問 : tech.kayac.com - KAYAC engineers' blog
来週は私が夏休みなので更新はない予定です。agoです。 最近、人にjQueryを解説する機会があったので、昔を思い出してjQueryを使い始めた頃に感じる疑問を書いてみたいと思います。 1 そもそも何で使うの？いまでも困ってないよ 作成する内容にもよりますが、慣れると使用しない場合に比べて記述するコード量が3分の1程度まで減ります。 また、変数、条件分岐、繰り返しが減るのでバグが発生しにくくなります。 2 何か特殊なことができる？ 結局できることは変わりません。 jQuery自体JSで書かれてますし、記述の自由度もJSの制約に制限されます。 3 何が難しいの？ 文法がややjQuery的になります。 参考 jQuery言語入門 jQuery自体のコード量は少ないのですが、独特の記述法が多く慣れるまで多少時間がかかるかもしれません。 また、CSS Selectorの知識はほぼ必須です。 特にマ
第10回（応用編-2）「グラフを書く-2」｜株式会社八光電機
前回は、簡単な棒グラフを書いたところで終わりにしましたので、今回は、もう少し複雑なグラフを書いてみることにします。 前回使った、幅・高さともに1ピクセルで、透明：img001.gif、白：img002.gif、赤：img003.gif、青：img004.gif の4ファイルに加え、黒：img005.gif、緑：img006.gif の2ファイルを用意しました。 <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <script> function disp() { var i,data=0,datb; var dat=new Array(); for(i=0;i<=7;i++) { dat[i]=eval(document.form01.elements[i].value); if(i%2==1) data=Math.max(data,
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Blogger
CentOS 5 - rsyncによるファイル/ディレクトリの同期 : Server World
Enabled=Falseのテキストボックスの文字の色 - OKWAVE
Loading...
http://nureinu.net/archives/3479614.html