CSSは分かるけど jQuery は苦手 … という人が jQuery に親しんでくれるといいなーと思って書きました
Webデザインをしていると、HTML と CSS だけではできない表現ってありますよね。そんな時によく使うのが jQuery。今回は jQuery っていまいちよく分からない ... っていう人が、jQuery に少しでも親しんでもらえたらいいなーと思って、知ってる事をまとめてみました。なので jQuery 初心者さん向けの記事です。 とっても当たり前なんですけど、Web サイトは基本的に HTML で書かれていて、デザインは CSS で装飾されていますよね。最近では CSS3 の登場で、簡単なアニメーションも CSS で作れるようになりました。でもクライアントワークでは、まだまだ CSS3 を使える部分が限られているし、Webデザインに少し動きなどをつけたい時などは、まだまだ jQuery を活用する事も多いです。 私は Javascript が苦手で、jQuery もどちらかというと苦
HTMLメールが必要な時のために！今から見ておくHTMLメールテンプレート色々 | バンクーバーのうぇぶ屋
カナダに来た時困ったのが「ニュースレター？HTMLに決まってるじゃん！」な日本の考え方とは違ったHTMLメールバンザイ文化。 これまでの日本でのプロジェクトにはそいえばHTMLメールなんて扱うことが無かったので、結構困りました。日本でそれほど需要があるようには思えないHTMLメールですが、いざ作らなければいけない状況に陥った時に、なんだかんだあったら便利なHTMLメールのテンプレート！ 「必要無い！」と言われればそれまでですが、日進月歩で突き進むWEB業界において、明日の絶対等ありえないのです！って、会社の先輩が言ってた！（どや顔） そんな説教じみたことを置いといても、HTMLメールのテンプレート、知っておいて損は無いと思うので、僕が「HTMLメール？何それ美味しいの？」って時に参考にしたサイトや、最近知ったテンプレートサイトなどをまとめてご紹介！ いつか使う時が来た時のためにも、見ておく
はてなダイアリーにいいねボタンを置く方法 - IT戦記
たっち！ みなさん、こんにちは お元気ですか、僕はアイスのあとラーメンを食べて気持ち悪い状態ですが元気です。 さてさて 最近は、フェイスブックやミクシィやツイッターなどの SNS で面白いと思ったモノを紹介し合う文化が定着してきているような気がします。 そんな中で、ウェブページを紹介するために使われるためにウェブページに置かれるものが「いいね！」ボタンだったり、「ツイート」ボタンだったりするわけですね。 というわけで、はてなダイアリーにそういったボタンを配置する方法を紹介したいと思います。 ここで紹介する方法は、ちゃんと理解して置きたい人向け、 XML や HTML を分かっている人向けとなります。 はてなダイアリーには自由な HTML を貼り付けられない まあ、普通に自由に HTML を貼り付けられる環境であれば、ただ単に提供されるボタン用の HTML を張り付けるだけなので簡単です。
HTMLタグ/イメージタグ/画像に並ぶテキストの位置を指定する - TAG index
top、middle、bottom は、 画像に並ぶテキストの位置（垂直方向）を指定します。 top … 画像の上端とテキスト行の上端を揃えます。 middle … 画像の中央とテキスト行のベースラインを揃えます。 bottom … 画像の下端とテキスト行のベースラインを揃えます。 フロートの指定 left と right は、画像のフロート（浮動化）を指定します。 left … 画像を左に配置して、後続の内容を右側に回り込ませます。 right … 画像を右に配置して、後続の内容を左側に回り込ませます。 フロートを指定する場合は、回り込みを解除するもご覧ください。 並ぶテキストの扱いについて top、middle、bottom … 画像の横には1行分のテキストが並びます。 left、right … 画像の横に複数行のテキストを回り込ませることができます。 top を指定している場合は、
サイト高速化で一石二鳥！ SEOへの絶対的な効果とは！？
『MarkeZine』が主催するマーケティング・イベント『MarkeZine Day』『MarkeZine Academy』『MarkeZine プレミアムセミナー』の 最新情報をはじめ、様々なイベント情報をまとめてご紹介します。 MarkeZine Day
<SPAN>
インライン要素：SPAN要素 <SPAN>タグ このタグは<DIV>要素と並んで、HTML文書を構造化する手順を決定します。このタグはインライン要 素で、ブロックレベル要素である<DIV>タグとはやや異なった表現や機能を持ちます。 ブロックレベル要素とインライン要素 インライン要素とは、新しい行を作らない要素のことです。それに対してブロックレベル要素と は開始タグで新しい行を作り、閉じタグで改行するものです。要素によっては改行後ラインブレー ク（一行の空白）を伴うものもあります。このため、インライン要素で文字の特性を指定した場合 でも、その要素だけでは改行が行われませんので、デザインがこわれることはありません。 <SPAN style=" "スタイルシートによる指示">テキスト</SPAN> style属性は、スタイルシートによるテキストの特性をインライン（本文中に毎回、必要なと
Meta robots noindex/nofollow/noarchiveタグの使い方 » 海外SEO情報ブログ・メルマガ
個の記事では、サーチエンジンのロボット（クローラ）の動きを制御するmetaタグについて解説します。 取り上げるのは、次の３つのmeta Robotsタグです。 noindex nofollow noarchive 順に説明します。 Meta robots noindex タグ noindexタグは、HTMLのheadセクションに次のコードを記述します。 <meta name="robots" content="noindex"> ※XHTMLで記述するときは、最後を「/>」で終了します。 noindexタグは、ウェブページをインデックスさせたくない、言い換えると検索結果に表示させたくないときに使います。 検索結果に出したくないページがあるときは、noindexタグが使えます。 他によくある使い道としては、まったく同じウェブページを複数公開する場合があります。 いわゆるミラーページを準備する
HTMLタグ/テーブルタグ/表を作る - TAG index
table要素 <table> ～ </table> 表の大枠を示す要素です。表の大きさや罫線などは、この要素の属性で設定することになります。 tr要素 <tr> ～ </tr> 表の行を示す要素です。例えば、3行の表を作成する場合は、この要素を3つ配置することになります。 td要素 <td> ～ </td> 表のセル（データセル）を示す要素です。例えば、横に3つのセルを並べたい場合は、各行（tr要素）の中にこの要素を3つ配置します。 th要素 <th> ～ </th> 表のセル（見出し用のセル）を示す要素です。td要素の代わりにこの要素を使用すると、そのセルが見出しとして扱われます。 一般的なブラウザでは、この要素内の文字列は太字になり、セル内のセンターに表示されます。 tbody要素について HTML 4.01では、table要素内にtbody要素（行をグループ化する要素）を配置するこ
[戯] target="_blank" を使わないで新しいウィンドウでリンクを開く方法
target="_blank" を使わないで新しいウィンドウでリンクを開く方法 2006-03-14-5: [JavaScript] <a href="foo.html" target="_blank">foo</a> を使えば新しいウィンドウでリンクが開きますが，これは XHTML 1.1 や XHTML Basic では採用されていません． ではどうするかというと，スクリプトを使うわけですが， <a href="javascript:void(0)" onclick="window.open('foo.html');">foo</a> こうすると，一見解決したようですが，JavaScript が off の場合はリンク先に飛べません． しかも，ステータスバーにリンク先が出ないので不安になります．これを <a href="foo.html" onclick="window.open('f
mailto:について
携帯電話内部のメールクライアントソフトを呼び出すものです。 現在、すべての携帯端末で、mailto:〜によるメールクライアント起動・メール送信先初期設定がサポートされています。 subject（メール題名）・body（メール本文）の初期設定に関してはサポートしていない機種がありますが、最近の機種はいずれもサポートしていると考えて良いと思います。 cc（同報）やbcc（匿名同報）をサポートしている端末もあります（下記表参照）。 ただし、これらの指定はあくまでデフォルト指定であり、ユーザー側で編集することができます。 題名等、固定化したいのであれば、フォームメール等のCGIスクリプトを使用する必要があります。 【参考サイト】 EZfactory mailto:の指定方法 http://www.au.kddi.com/ezfactory/tec/spec/wap_tag9.html
lockエラー | 月額200円からのレンタルサーバー JSN
まずは最近知って便利だと思ったCSSの小技をひとつ。 文章の最後に、「※（米印）」などで注釈を入れたいときに、CSSのみで行の開始位置を揃えるのにすごくシンプルなやり方がこれ。 .note { padding-left:1em; text-indent:-1em; } <p class=”note”>※米印を使う場合はこいつが便利。<br /> 改行してもこの通り。ちゃんと開始位置が揃ってる。</p> 「padding-left : 1em;」でまず１文字分右に動かして、「text-indent : -1em;」で最初の行だけ１文字分左に出す、ということらしいです。これ考えた人はえらいっすねぇ。 他には開始位置を揃えるいわゆる「ぶら下げ」をCSSでやる場合、<div>タグの入れ子を使ってもいいが、<dl><dt><dd>の定義型リストを使うのがおすすめ。Definition Listの略で
文字コード宣言は行いましょう(HTML) - Web標準普及プロジェクト
文字コード宣言は行いましょう(HTML) HTMLで日本語を使用する場合、そのファイルの保存方法が複数存在します。 それはいくつかのルールを使用して日本語を保存し、ブラウザがそのルールに則って読みとることで表示するためです。 このルールのことを文字の符号化方式と言います。 何故文字コードの宣言が必要なのか 保存する時の文字コードとブラウザが読みとる時に使う文字コードが違っていると文字化けが発生してしまいます。 これは一部の符号化方式を除き、そのファイルがどのような文字コードで保存されたものなのかをブラウザが判別できる確実な手段が無いために発生します。 しかし、そのHTMLファイルの作者がブラウザに対してどのような文字コードで保存したのかを明示することによってブラウザは確実に表示できるようになります。 それが文字コードの宣言です。文字コードは次のようにmetaタグを使って宣言します。 ISO
ホームページ キッチン-- テーブルデザインのためのCellpadding
HTMLソース- - - - - - - <table width="300" border="0" cellspacing="0" cellpadding="5"> <tr> <td width="100"></td> <td width="100"></td> <td width="100"></td></tr></table> - - - - - - - - - - - - - - こんどは綺麗に3等分されました。 ではspacer.gifを入れてみよう。(透明ではなく黒色の画像にしています) まずは、単純に、TD内に、100pxの幅のspacer.gifを入れてみます。 HTMLソース- - - - - - - <table width="300" border="0" cellspacing="0" cellpadding="5"> <
ちょこっとHTML（ホームページは難しくない）
● 入力フォームを作ろう ● フォームをメールで送信 ● 送信ボタン ● リセットボタン ● 画像を使った送信ボタン ● ボタンを作る ● テキストの入力フィールド（１行） ● テキストの入力フィールド（複数行） ● 隠しフィールド ● ラジオボタン ● チェックボックス ● プルダウンメニュー ● リストボックス ● 選択メニューの階層化 ● 入力項目のグループ化 ● 部品にラベルをつける
無料ホームページテンプレートの素材屋｜テーブルタグ素材・HTMLテンプレート素材集
ＨＰ作成：文字タグ 字色・サイズ <font> 強調太字 <strong> 強調斜体タグ <em> 文字移動 <marquee> ＨＰ作成： 区切りタグ 改行タグ <br> 見出しタグ <h> 段落タグ <p> 一本線タグ <hr> ＨＰ作成：リンクタグ リンク用タグ <a href=""> ページ内リンク <a name=""> メール起動リンク <a href=""> リンク色の変更 link="" vlink="" ＨＰ作成：リストタグ マークリストタグ <ul><li> 数字リストタグ <ol><li> 用語説明タグ <dl><dt><dd> ＨＰ作成：画像タグ 画像表示タグ <img src=""> 画像内リンク <img src=""> ＨＰ作成：テーブル 枠組み・表 <table><tr><td> レイアウト・配置 <table><tr><td> ＨＰ作成：その他 範囲指定タ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IT news, careers, business technology, reviews
HTMLやCSSが手間なく書けるZen Coding | Zen Coding 1-1 | HTML+CSSコーディングが10倍速くなるZen Coding
http://www.html-cool.com/samples/tryhtml_tables3.html
HTMLタグ/テーブルタグ/セル内の文字の位置を指定する - TAG index
HTMLクイックリファレンス