画像を左側に、テキストを右側に持ってくるレイアウトがある場合、画像に対して普通に float で回りこみを行うと以下のような表示になります。 このようなレイアウトの際に、画像の下にテキストを回り込ませない表示にする場合はテキスト部分に対して overflow: hidden を書ければ簡単に回りこませなくすることができます。 HTML
画像を左側に、テキストを右側に持ってくるレイアウトがある場合、画像に対して普通に float で回りこみを行うと以下のような表示になります。 このようなレイアウトの際に、画像の下にテキストを回り込ませない表示にする場合はテキスト部分に対して overflow: hidden を書ければ簡単に回りこませなくすることができます。 HTML
↑CSSだけでこんな感じに上下中央揃えを実現させるテクニックです。下記の3つの方法を紹介します。 ・1行のみのテキストを中央揃えにする場合 ・2行以上のテキストまたは画像を中央揃えにする場合 ・高さが決まっていない要素を中央揃えにする場合 1行のみのテキストを中央揃えにする場合 <!-- HTML --> <div> <p>1行のみのテキストに有用</p> </div> /* CSS */ div{ width: 200px; height: 100px; background: #DDDDFF; text-align: center; } p{ line-height: 100px; } →1行のみのテキストを中央揃えにするサンプル line-heightは行間のスペースを制御するプロパティです。なので、2行以上の文などには利用できません。1行だけの場合には簡単に実装できる有用な方法です
デザイン上の表現ではよく使われるのにCSSでの再現は意外と難しいボックス内での上下中央揃え。 ボックス要素(block要素)には上下中央揃えの指定は無く、vartical-alignも効きません。 そういった場合の時は、上下のpaddingで何とか調整をしたり、諦めてテーブルで再現したり、悩みどころだったりするのですが、いちよCSSでも再現する方法はあります。 「display:table-cell」を使用する方法。 ボックス要素とする<div>に対してdisplayをtable-cellにすることで、vartical-alignの効果を発生させるもの。 ですが、IEではこの「display:table-cell」はサポートされていないので、IEのみ「display:inline」の指定をします。 まずは再現したサンプルについて。 ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ 実際のHTMLソース&
HTML5には、Media Capture APIと言うものがあり、HTMLからカメラのキャプチャや音声の録音ができるらしい。 と言う事でちょっと試してみた。 現状ではPC向けブラウザでは対応しておらず、Android3.0以降で対応しているとのこと。 Mac版のChrome 21では、普通のファイル選択フォームとしか動作しなかった。 Android4.1のGalaxy Nexusで動作確認をした。 とりあえずHTMLは次のような感じ。 <html> <body> カメラ<br /> <input type="file" accept="image/*" capture="camera" id="capture"><br /> <br /> マイク<br /> <input type="file" accept="audio/*" capture="camera" id="capture2
MacではFinder、Windowsではエクスプローラがたくさん開くとうっとうしいですよね。 それを避けるため、Windowsを使っていたときはエクスプローラをタブ化するソフトを使っていました。 もちろん、MacでもFinderのタブ機能が欲しい。むしろデフォルトでAppleに実装してほしい。 以前はTotalFinderというアプリを使っていたのですが、なぜかうまく動かなくなったり(個人的な環境の問題かも)有料化したり。。。 これを機にTotalFinderもしくはその他のタブ機能付加アプリを購入するかどうしようか迷っていたところ、無料で使えて機能もバッチリな「XtraFinder」を見つけました! Google Chromeと見た目も操作もそっくりなタブをFinderに組み込むことができ、カット&ペーストやフォルダ優先表示といった機能まで備えています。 めっちゃオススメです! Xtr
これはMac OS X 10.5当時の話である。 以前、MacとWindowsでファイルを圧縮し、文字化けせず正常に解凍できるかテストを行ったが、最近の状況は分からない。 当時、意外とDropLHaとDropUnLHaの結果が良好だった。 次点でCleanArchiver 3.0a6、次にMacWinZipperあたり。 試した圧縮・解凍ソフトには以下のようなものがある。 Macの標準機能でzipファイルを作成 Mac OS Xでは標準の機能でファイルやフォルダをzip形式に圧縮できる。 例えば「test」というフォルダのコンテクストメニューを開く([Control + クリック] や [右クリック]する)と「"test"を圧縮」という項目が表示される。 「"test"を圧縮」を選択すると、「test」フォルダを圧縮したzipファイル「test.zip」が作成される。 特にソフトをインスト
飲料大手 商品紹介ページ 電器大手 商品紹介ページ 通信大手 携帯アクセス制御 モック 洋酒輸入代理店 イベントサイト ポータル大手 コラムページ 不動産フランチャイズ派遣サイト 不動産会社サイト 基礎コーディング 検定サイト 学校サイト サニタリー会社サイト 税理士事務所CMSサイト OS系フォーラムサイト 等 スコープ内 HTML、XHTMLコーディング PSDデータからの画像切り出し 既存スクリプトの埋め込み スコープ外 レイヤー選択 flash制作 ビジュアル設計 システム設計 ※スコープ外の作業は主に外部制作です ターゲットブラウザ IE6,7,8,9 最新のFireFox、Opera、Safari、Chrome
関西の電車でつながりやすいキャリアはどれだ?──ICT総研がiPhone 5で実測調査:関西の路線は山が多いからなあ ICT総研は、関西で調査した「電車移動中のスマートフォンつながりやすさ実測調査」の結果を4月16日に発表した。関東の調査結果より低い傾向があったという。 ICT総研が行った、「電車移動中のスマートフォンつながりやすさ実測調査」(関西編)では、NTTドコモ、au、ソフトバンクモバイルのそれぞれで、圏内だった時間、音声通話の接続が継続した時間、LTEで接続していた時間の割合を調査している。 測定した機材は、ドコモがSIMロックフリーのiPhone 5にドコモのnanoSIMを差したものを用意、au、ソフトバンクもそれぞれのiPhone 5を用意した。調査期間は4月1~3日で、調査した時間は原則日中だが、JR大阪環状線は、混雑時間帯の状況を調べるため、19時台に行っている。 調査
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く