テキストの回りこみ処理をCSSで実現するための『CSS Text Wrapper』 | 100SHIKI
テキストの回りこみ処理をCSSで実現するための『CSS Text Wrapper』 December 7th, 2007 Posted in その他 Write comment 他サイトでも紹介されているが、個人的にぐっと来たのでご紹介。 複雑な図形の形にあわせてテキストを回り込ませたい、というときがたまにある。 ワードやイラストレーターではそういった処理が可能だが、ウェブでそれを再現しようと思うとちょっと厄介だ。 そこで登場したのがCSS Text Wrapperだ。このサイトでは自分で好きな図形を描き、それにあわせてテキストを配置することができる。 そのようにして作った「テキストの回りこみ処理」はCSSのコードでダウンロードすることができる。このコードを回り込ませたいテキストの直前に配置するなどすれば自分のサイトで簡単に応用可能だ。 ウェブで表現するのが厄介、で思考停止せずに、こうした
ハタさんのブログ(復刻版) : javascriptを初めて学ぶ人についてのおさらい。その１
僕にも教える人ができた(? というか人にモノを教える立場)になったので、とりあえず、最近はもっぱらjavascriptを教えています。 もともとCやJavaなどについてはある程度の知識がある人なので、それを少しjs的な意味で、関数言語的な教えをやっている最中のメモ 変数って何ですか？変数って値もしくは式そのものに利便的な名前をつけているものです 次のhogeとfooは値をいれる箱ではなく、値そのものに別名(もしくは分かりやすい名称)を割り当てているだけに過ぎませんよ。 var hoge = 1; var foo = [1, 2, 3]; alert(hoge + 1); // 2 alert(foo[0]); // 1 alert(1 + 1); // 2 alert([1, 2, 3][0]); // 1 つまり、関数自体を変数に代入する事ができます。(functionとは特別な呼び名
特集:基礎から理解するデータベースのしくみ - 特集:基礎から理解するデータベースのしくみ：ITpro
「データベースはブラックボックス。どんなSQL文を投げたらどんな結果が返ってくるかさえ知っていればよい」---そう思っている人も多いかもしれません。 しかし，本物のソフトウエア・エンジニアを目指すのであれば，データベースが動く仕組みを学ぶことは避けて通れません。パフォーマンスなどに問題が生じたときどこから手を付けていいのか皆目見当がつかない，といった事態に陥りかねません。 市販のRDBMSの内部はかなり複雑ですが，基本的な部分を理解するのはそれほど難しくありません。この特集でデータベースの動く仕組みを理解してください。 イントロ ●ブラックボックスのままでいいの？ 基礎から理解するデータベースのしくみ（1） Ｐａｒｔ１ ●SQL文はどのように実行されるのか 基礎から理解するデータベースのしくみ（2） 基礎から理解するデータベースのしくみ（3） 基礎から理解するデータベースのしくみ（4） 基
【ハウツー】ゼロからはじめるFlex 2 - Flex 2で作る簡単なWebカタログと商品注文フォーム (1) Adobe Flex 2を使ってみよう | パソコン | マイコミジャーナル
本稿では、ここ最近、Web系プログラマーの間で話題になっているAdobe Flex 2を使って、商品注文フォームを作る過程を紹介します。Flexはすでに様々なところで、機能が紹介されていますが、実際にその機能を使う時にどんな手順で作るのか、またどのくらいの作業量が必要になるのかという部分までは、なかなか見えてこない部分があります。そこで本稿では、一歩突っ込んで、簡単なWebカタログと商品注文フォームを作ることで、Flexという技術の魅力を確認していこうと思います。 今回作成するプログラム ここではFlex Builder 2を使って簡単なWebカタログと商品注文フォームを作ってみます。このURLでテスト版を試すことができます。 商品選択画面 フォームには郵便番号を自動検索する仕組みもある Flex 2の魅力はコンポーネントにあり Flex 2には、豊富なコンポーネントが用意されており、本稿
RedLine Magazine : 気になった初期化CSS
気になった初期化CSS コリスさんの記事でブラウザのデフォルトスタイルを初期化するCSSのサンプルが多数掲載されていました。 >> [CSS]ブラウザのスタイルを初期化するスタイルシートのサンプル集 | コリス 初期化する内容やどこまで初期化しておくのかは案件ごとのデザインなどによってケースバイケースだったりして、完全にこれが私のリセットCSSですと言えるものはないのだけれど、それなりにいつもだいたい使いまわしている自分のリセット部分のソースと見比べて考えてみた。いろいろと拝見して気になったものが2つあったのでメモ。 select option に paddingを指定する 予めブラウザのデフォルトスタイルを全称セレクタ（*）なんかで一気にpaddingを0に指定してしまうと、Fxなどの一部のブラウザでだけのようだけど、selectのoptionの右端が下向き矢印マークで隠れてしまうことが
Pythonを始めよう：CodeZine
はじめに こんにちわ、hirataraです。 本稿では、オブジェクト指向のスクリプト言語であるPythonの紹介をしたいと思います。と言っても、実は私がPythonを勉強し始めたのは数ヶ月前のことで、まだPythonに関してさほど詳しいとは言えません。それでもこの記事を書こうと思い立ったのは、ある言語が他の言語に比べて面白い部分と言うのは、その言語にどっぷり漬かってその言語を使うことが当たり前になっている人間よりも、その言語を好きになり始めたくらいの人間の方が見つけやすいのではないかという思いからです。 そのような事情で、もしかすると本当のPythonistaからお叱りを受けるような内容も含まれるかもしれませんが、その点はTBやコメントでご教授頂けると幸いです。この記事で、少しでもPythonに興味を持ってくれる方が増えることを願っています。対象読者他言語でのプログラミング経験者Pytho
はじめてのJSONPプログラミング
前回の「ブログの☆の総数を取得できるAPIを組み込みました」では、はじめてJSONPを使ってみました。以下、実際にJSONPを使ってみての覚え書きと、これからJSONPプログラミングをはじめる方へのTIPSです。 ブログの☆の総数を取得できるAPIは、はてなスターに登録されたブログの情報を取得できるJSON形式とJSONP形式で提供されているAPIでした。 はてなスター日記 - ブログの☆の総数を取得できるAPIを追加しました JSONとは、JavaScriptにおけるオブジェクトの表記法をほぼそのまま利用したデータフォーマットのことで、JSONPはJSONにちょっと記述を加えて、クロスドメインのJSONデータを非同期で読み込ませて処理するための手法のことです。（詳しい定義については、自分で調べてみてください） 通常、Webブラウザでは他ドメインのJavaScriptのデータを読み込んで実
CSSで角丸テクニック２５:phpspot開発日誌
CSS Juice - Design, Tutorial, Showcase and more 25 Rounded Corners Techniques with CSS Rounded corners is one of the most popular and frequently requested CSS techniques even the father of internet Google also launch the rounded corners style markup with her Google Adsense and let users to custom their ads recently. CSSで角丸テクニック２５がまとめられていました。 様々なサイトにでの角丸実装ドキュメントのまとめです。 Sliding Doors Even More Round
livedoor Readerパーフェクトガイド - livedoor ディレクター Blog
※この記事は、2013年3月14日にアップデートしました。 こんにちは、「livedoor Reader」などのディレクターを担当している佐々木です。 「世界の技術者、刺激したい」―ライブドアRSSリーダー英語版公開 「RSSリーダーにも2対8の法則がある」と池邊CTOは言う。2割のヘビーユーザーが、8割のフィードを読んでいるというのだ。「livedoor Readerは、2割の人に最適化している」 これは弊社スタッフの偽らざる本音なのですが、そうは言っても、より多くの人に使っていただけるよう、livedoor Readerのサイト上では初心者向けの説明を中心に掲載しています。 しかしそれによって、2割のヘビーユーザーに対して満足な説明ができていなかったのではないか、ということを心配してきました。 そこで今回は、Webディレクター向け（つまり、2割に相当するヘビーユーザーであるべき職種の人
Open Tech Press | Vimマスターへの道
viクローンのVimは、Emacsと並ぶオープンソース・エディタの巨頭である。このエディタは、単にviのオープンソース版というだけではなく、スクリプトやプラグインによる高い拡張性といったオリジナルのviにない特徴も備えている。しかし、viから引き継いだ独特の操作法から、Vimを敬遠している向きも少なくないようだ。そこで以下では、Vimの操作を習得する、あるいはVimをもっと活用するためのハウツーを紹介する。 2007年11月13日更新：中級編に「Vimのステータスラインをより有効に活用する設定法」を追加 初級編 Vim 最初の一歩 Vimの簡単な始め方 2007年04月13日 Vimの無数の機能と柔軟さはベテランのユーザにとっては大きな利点であるが、初心者にとっての敷居を高くしてしまっているというのも事実だ。あなたがもし、Vimを使いたいとずっと思っていながらも初めて試したときにうんざりし
はじめてのAIRプログラミング
コードネーム「Apollo」と呼ばれていたWebアプリケーションプラットフォームは、Apollo から Adobe AIR へと名称が変更され、正式名称は「Adobe Integrated Runtime」となりました。 以前、「はじめてのApolloプログラミング」という記事を書きましたが、今回新たにAdobe Airに触れなくてはいけない機会がありました。 そこで、はじめて「AIR」アプリケーションを開発する際の手順を、ここに記しておきます。 1. AIRアプリケーション開発に必要なものをダウンロード 2. AIRアプリケーション開発環境インストール 3. AIRアプリケーション開発環境パス設定 4. はじめてのAIRアプリケーションプログラミング 5. AIRアプリの実行 1. AIRアプリケーション開発に必要なものをダウンロード AIRアプリケーションを開発するには、当然それを開発
ムービー企画「 Subversion によるバージョン管理入門」WEB+DB PRESS Vol.39 誌面連動ムービー
ムービー企画「Subversionによるバージョン管理入門」 WEB+DB PRESS Vol.39誌面連動ムービー バージョン管理ツールSubversionは、現在のプログラミング開発において欠かせないツールです。Subversionを利用することにより、ソースファイルの変更を管理することができます。また、複数の開発者がソースコードに対して同時並行に変更を施せます。 この記事では、Subversionの基本操作方法をムービーでご紹介します。 なお、WEB+DB PRESS Vol.39、特集1「構成管理 実践入門」の誌面連動ムービーにもなっています。 誌面の第2章「Subversionによるバージョン管理入門」では、svnコマンドによるSubversionの使用方法をご紹介いたしました。 Windowsの場合は、第2章のコラムで紹介したTortoiseSVNを使って、GUIベースでSub
javascriptを理解するためのたった2つの大切なこと
9割ぐらいはハッシュ何がハッシュなのかjavascriptで存在するほとんどのオブジェクトの実体はハッシュだよ。 var arr = [0,1,2,3]; とかをみると配列(人によってはリスト)に見えると思う。でも実際は違うんだ。 これは var has = {0:0,1:1,2:2,3:3}; と基本的には等価なんだ。ただちょっと束縛されているメソッド(インターフェイス)が違うだけ。 ためしに arr[4] = 4; arr['x'] = 'string'; arr[-1] = -1; としてみよう。 Firebugで確認してみると[0, 1, 2, undefined, 4]というような値がかえってくるよ。 でもarr[-1]やarr['x']の値は保存されてないのかな？そんなことはないちゃんとアクセスできるんだ。 それどころかarr.xで'string'がかえってくるんだ。 別の例を
JavaScriptの巧い書き方 - Archiva
Make a note of it: Web tech, montaineering, and so on. Note: この記事は、3年以上前に書かれています。Webの進化は速い！情報の正確性は自己責任で判断してください。 Webに言語は数あれど、特に玉石混淆の激しいJavascriptの書き方について纏めてみた。間違い指摘大歓迎！ 発端はYahoo!の Eric Miraglia による、YUI 式モジュールの作り方をまとめた記事。ざっくりまとめると、以下の手順になる。 YAHOO.myProject.myModule = function () { //"private" variables: var myPrivateVar = "I can be accessed only from within YAHOO.myProject.myModule."; //"private" m
栄光ゼミナール；塾選びガイド
栄光ゼミナールとほかの塾との授業料、サービスなどさまざまなポイントについて比較しています。栄光ゼミナールの授業料、サービスなど充実させたコンテンツで作成していますが、やはり一番栄光ゼミナールを知るには、資料請求が一番です。 栄光ゼミナール資料内容 日程と授業料についてのご案内 栄光ゼミナールの夏期講習のご案内 個別指導のご案内。 「今子供たちは・」資料集栄光ブックレット とっておきなＤＶＤ（届くまでお楽しみ） 栄光ゼミナールでは、はじめての方には無料の夏期講習会になります。テキストの教材費は自己負担になりますが、それでも1教科につきたったの2100円。 栄光ゼミナールは特に中学生を対象に向けて圧倒的人気のサービスです。もちろん、それに付随するしっかりとしたサービスがあります。大手の学習塾には、有名講師が授業を100人程度で聞くタイプと少人数制（6人から20人程度）できめ細やかな授業
TRANS - 携帯用CSSを書く上で押さえておくべきポイント
先日、diggでVitamin Features » Make your site mobile friendlyというエントリーが上がってきてました。見てみると、非常にうまい具合に携帯向けのCSSやHTMLの書き方などが紹介されていました。僕も携帯向けCSSの書き方には興味があったので、勉強がてら重要なポイントを抜き出して、和訳してみました。 和訳文は次からスタートです。（上記サイトの「mobile」は携帯電話やPDAを含めたモバイル機器が正確な訳ですが、ここでは話を分かりやすくするために「mobile」を全て「携帯」と訳しています。） 基本からスタートしよう。 既に論理的でセマンティックなHTMLを構造化しているんだったら、携帯を含めたどのデバイスでもきれいに、使いやすく、アクセシブルになっています。携帯によっては、WAPに準拠しているかもしれないし、もしかしたらWAP2もいけるかもし
これで完璧！ロゴデザインのためのお役立ち資料まとめ | P O P * P O P
これがあればもう完璧ですね・・・300以上ものロゴデザインに関するサイトを集めたまとめです。 チュートリアルからロゴデザインのアイディアまで・・・かな～り使えるのではないでしょうか。300以上もあるのでさすがにいくつかのカテゴリーに分類されていますね。 どんな役立つ資料があるのでしょうか。詳しくは以下をどうぞ。 ↑ ロゴのタイポグラフィーに関する資料いろいろ。フォントは悩みますよね・・・。 ↑ お約束ですが、「2.0っぽい」ロゴデザイン集についてもいろいろ教えてくれます。 ↑ 素敵なロゴデザインを集めたサイトも紹介してくれます。 全てのカテゴリーは以下のとおりです。是非ご活用ください。 Importance of Logo （ロゴの重要性） Logo Design Software （デザインのためのツール） Logo Design Tutorials （チュートリアル） Logo Fil
萌え理論Blog - CSSまとめ
解説 CSSとは CSS*1とは、(X)HTML文書の見栄えを整形するための、Web標準*2の指定方法です。要するにホームページをデザインする手段です。CSSを使わなくてもHTMLで直接デザイン*3できなくはないですが、CSSを使った方が標準的で効率的です。例えば100枚のHTMLファイルを一つのCSSで一括して指定できます。また、はてなダイアリーもそうですが、ブログのデザイン指定にも使います。 基本 スタイルシートの基本 -- ごく簡単なHTMLの説明 よく使うCSSの話|基本編 CSS Nite Vol.7: Web制作現場の対立を解消する！ XHTML+CSSガイドライン作り [1] 一覧 とほほのスタイルシート入門 【HTMLタグの簡単検索】TAG index - Web制作情報 レイアウト CSSによる段組（マルチカラム）レイアウト講座 スタイルシートによる崩れない 2カラム 3
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【実戦テク総集編 Part2】Excelの究極テク250 第1回：デジタルARENA
連載記事 「さらっと覚えるSQL＆T-SQL入門」 － ＠IT