h1タグはページに一つだけ?

Word文書でスタイルを使うと次のようになると思います。
便宜的にHTML風のタグを付けてみました。 (さらに…)

右クリックと文字列選択を禁止する方法とそれを無効にするブックマークレット

ウェブページの文字列をコピーされないようにする方法として、右クリックを禁止する方法と文字列の選択を禁止する方法が考えられます。 (さらに…)

「Twitterに投稿」用のリンクとブックマークレット

自分のウェブサイトのタイトルとURLをTwitterに投稿するための「リンク」は次のように書きます。

<a href="javascript:(function(){window.open('http://twitter.com/home/?status=' + '〈' + document.title + '〉' + document.location.href)})()">Twitterに投稿</a>

そして、この「リンク」を右クリックしてブックマークに登録するとブックマークレットになります。この場合は自分のウェブサイトでなくても使えます。

Twitterに投稿

Excelの色をHTMLに変換

ExcelのVBAにはRGB関数というものがあります。

RGB(red, green, blue)

赤と緑と青にそれぞれ0から255までの整数を当てはめて色を表します。
関数になっていますが、内容は単純で
RGB=red+green*256+blue*256*256
という計算をしているだけです。

一方、HTMLで色を指定するには「#00FFFF」という形式を使います。
赤と緑と青にそれぞれ0から255までの整数を当てはめて、それぞれ16進数で表わし、頭に「#」を付けます。

Excelで表わされる色をHTMLの表現に変換するユーザー定義関数を作ってみました。 (さらに…)

HTMLのテキストボックスに工夫を施す小技いろいろ

HTMLのテキストボックスに工夫を施す小技を。


input(text)


文字を選択。ボックスをクリックするとボックス内の文字列が自動的に選択されます。
<input type="text" onclick="this.select()" value="abcde">



文字を赤に。
<input type="text" value="abcde" style="color:red;">



文字のサイズを1.5倍に。
<input type="text" value="abcde" style="font-size:150%;">



ボックスの幅を200ピクセルに。
<input type="text" value="abcde" style="width:200px;">


textarea


文字を選択。
<textarea onclick="this.select()">abcde</textarea>



IMEをアクティブ。
<textarea style="ime-mode:active;">abcde</textarea>

IMEを非アクティブ。
<textarea style="ime-mode:inactive;">abcde</textarea>

モニターで長さを測る方法

目の前にパソコンはあるのだけれど、定規がない場合にパソコンのモニターで長さを測る方法です。WindowsXPで使えます。

スタート-コントロールパネル-画面を開き(デスクトップ上で右クリック-プロパティでも可)、設定タブを選択してください。
詳細設定をクリックすると「DPI設定」のところに「96DPI」などと書かれています。これは画面が1インチあたり96ピクセルであることを表します。以下、96DPIを前提に。

今、HTMLを使って10センチ(100ミリ)の線を書きたいとします。
1インチは25.4ミリですので、96×100÷25.4=378(ピクセル)となります。
次のように書くと幅10センチの細長い四角が描かれます。

<img src='temp.png' width='378px' height='20px'>

JavaScriptで書くならば次のような感じで。長さが変えられます。

var mm=100;//10センチならば「100」ミリ
var dpi=96;
var mmpi=25.4;//1inch=25.4mm
var pxl=mm*dpi/mmpi;
document.write("<img src='temp.png' width='"+pxl+"px' height='20px'>");

10mm
20mm
30mm
40mm
50mm
60mm
70mm
80mm
90mm
100mm

HTMLでリストを横に並べる

HTMLで<li>を使ってリストを作ると縦に並びますが、これを横に並べる方法です。

CSS

ul{margin:0px;padding:0px;}
li{display:block;float:left;width:100px;}

HTML

<ul>
  <li>リスト1</li>
  <li>リスト2</li>
  <li>リスト3</li>
  <li>リスト4</li>
</ul>

HTML色見本(モノトーン編)

モノトーンでカラーネームの付いているものだけピックアップしました。
グレーよりもダークグレーの方が明るい?  (さらに…)

新しい記事

タグ

カテゴリー

最近の投稿

最近のコメント

固定ページ

アーカイブ

stabucky

写真

メタ情報