2005年01月26日

Blogカスタマイズ56〜毎日記本文内にテキストエリアを設定〜

テキストエリア(textarea)内にCSSを書き込むとそのままタグが表示されるのは以前から知っていましたが、
詳しく書いていなかった事と、テキストエリア内をクリックすると「全て選択」する方法が分かりましたので、
書いておきたいと思います。(殆ど使う事はないと思いますが。笑)


※一つ注意する事は、記事をアップする時に「フォーマット」の「改行を<br/>タグに変換」を選択すると、
 テキストエリア内の改行の部分に<br/>タグ が自動的に書き込まれてしまいます。
 それを回避するには、「変換しない」を選択し、テキストエリア外の文章の改行部分に
<br>タグ を入れる必要があります。

(例)
 まず、下記のタグをコピーします。<br>
 それをメモ帳に貼り付け、保存します。<br>


★テキストエリアを設定

●基本

<textarea>CSS(文章)</textarea>

テキストエリア内に記載したいCSS(文章)などの前後に太文字の部分を書き加えます。
テキストエリア内の文章は普通に書き込んで構いません。(外の文章に関しては上記を参考にして下さい)
記事を保存する時には、「フォーマット」の「変換しない」を選択してから、保存をします。

●テキストエリアを見栄えよく設定

<textarea rows=3 cols=80 readonly style="color:#666666; background-color:#ffffff; border:1px solid #666666; margin:10px;padding:10px;">CSS(文章)</textarea>

rows…テキストエリアの縦幅を設定する事が出来ます。
cols…テキストエリアの横幅を設定する事が出来ます。
readonly…テキストエリア内に書き込みが出来ないように設定します。
style=""…" "内にCSSを設定する事が出来ます。

color…テキストエリア内のの文字色
background-color…テキストエリア内の背景色
border…テキストエリアの枠線の太さ・種類・色
      種類(none=線なし、dotted=点線、dashed=粗い点線、solid=実線、
         double=二重線、groove=谷線、ridge=山線)
margin…テキストエリアの外側の余白
padding…テキストエリア内の余白

※スクロールバーの色も変更出来ると思います。
scrollbar-face-color…表面
scrollbar-arrow-color…矢印
scrollbar-highlight-color…ハイライト
scrollbar-shadow-color…影
scrollbar-base-color…ベース
scrollbar-3dlight-color…左端と上端
scrollbar-darkshadow-color…右端と下端

※詳しくはこちらを参考にして下さい。


■テキストエリア内をクリックすると「全て選択」になるを設定

<textarea onfocus="this.select()">CSS(文章)</textarea>



■テキストエリア内をポイントすると「全て選択」になるを設定

<textarea onmouseover="this.focus()" onfocus="this.select()">CSS(文章)</textarea>





 ■【堀江貴文・ホリエモンもオススメ!】 パソコン教室!397時間動画パソコン教室DVD4枚組!
   ホームページ作成、オフィス(ワード、エクセル、パワーポイント、アクセス)2003/2007、Photoshop、Illustrator、Dreamweaverなど
   29ジャンルが自宅で学べます!
 ■離婚大全集〜圧倒的有利に離婚する方法〜
   離婚経験者の専門家が、27冊の書籍やテレビでは語れない裏ワザがここに。
 ■運動なし!代謝を高めて無理なくやせるDLダイエットサポート 太らない身体が目標!
 ■【15秒筋トレ】自宅でお金をかけない肉体改造! 目標はゴリマッチョ?細マッチョ?
 ■1,353人のメガネ使用者がわずか3日で視力が1.0に!!見える!驚異の視力回復法 自宅で簡単に視力アップ!
 ■【ホリエモンブログ】で紹介されました!【せどり】でリッチ☆に!最強せどりツール【せどリッチforCD】
 ■ダウンロード販売と人と人をつなぐコミュニティ・コマースのインフォカート
 ■引っ越しを考えている方必見!すごいっ!
  ・全国賃貸情報【アパマンショップ】

  ・引越し一括見積もりサイトの決定版!【引越大手比較.com】

 ■ロリポップサーバーのドメインが65種類 → 85種類に!!初心者でも安心なサービスがあります♪

 ■ ダイエット商品人気ランキング
  この夏はみんなのオススメダイエットにチャレンジ!
 ■ラブコスメティックすごいっ!
  人に言えない身体の悩みをすっきり解決しましょう♪

よろしければ人気blogランキングにご協力を!

この記事へのトラックバックURL

  迷惑トラックバック対策のため、トラックバックはこちらでチェックした後、アップさせて頂いておりますので、ご了承下さい。

(Cookieに投稿者情報を記憶します)
 
コメントをプレビューする
ご利用のブラウザの設定ではご利用になれません。