iPadだけにCSSを適用する方法 | Web活メモ帳
2010.08.20追記 こちらの記事はipad「だけ」に適用する内容ではありませんでした。 実際にはJavaScriptなどの条件判定が必要なようです。 「HOWTO: CSS for the iPad」というエントリーにてiPadだけにCSSを適用する方法が紹介されていましたので、メモ的にエントリー。 詳しくは以下 設定方法 以下のコードで設定できるようです。 <link rel="stylesheet" media="only screen and (max-device-width: 1024px)" href="../ipad.css" type="text/css" /> このタイプのメディアタイプを扱えないブラウザが無視するためiPadだけに適用されるようになるようです。 同様のやり方でiPhoneにも対応できるとの事。 iPhoneだけに適用したい場合はmax-device
DIVを垂直方向に中央寄せするCSSサンプル:phpspot開発日誌
Blue Box Demo: Vertical Centering with a Shiv Div DIVを垂直方向に中央寄せするCSSサンプル。 次のように、DIV要素をブラウザの縦方向に配置できます。 CSSは非常にシンプルで、まず、html と body 要素に height:100% プロパティを設定します。 次に、body内にdiv要素を配置し、そのdiv要素に対し、height:50% かつ、margin-top:-50px のようにプロパティをあて、 中央寄せしたい要素(上図中、青い部分)の半分のサイズ分のマージンをマイナスします。 最後に中央寄せしたいdiv要素( height:100px ) を配置することで、青い部分は中央によります。 垂直方向に、100px のdiv要素が配置される感じです。 <html> <head> <style type="text/css">
[CSS]IEで、min-widthやmax-widthを実現する方法
CSS-Tricksで、IE用に「expression」を使用して、min-width、max-widthを実現する方法がエントリーされていました。 The Perfect Fluid Width Layout デモページでは、最小幅780pxを維持しつつ、最大幅1280px以上になると残りの箇所は背景画像が表示されるようになっています(参照：キャプチャ画像)。 min-width、max-widthの箇所は、下記のように記述されています。 #page-wrap{ background: white; min-width: 780px; max-width: 1260px; margin: 10px auto; width:expression(document.body.clientWidth < 782? "780px" : document.body.clientWidth > 12
CSS Lecture: min-width、min-height、max-width、max-heightをIE6でも実装する方法
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
CSSでボックス要素を画面中央に表示させてみる – VERSIONFIVE
少し前に出た話題だけど、CSS(だけ)でブラウザのウィンドウの中央にボックスを表示させてみようと試みました。元ネタは以下の記事より。 CSSでDivを天地左右中央に配置する方法『locate div at the center vertically and horizontally』 | CREAMU 仕組みとミソ 元記事のようにネガティブマージンを使い、中央配置したボックスの大きさよりブラウザのウィンドウが小さくなると、右上半分が消えてしまいます。さらに、position: static;なbody要素に絶対配置すると、ブラウザのウィンドウを小さくしていくとうまいこといかない (画面の中央に表示されない) 現象がみられます。ということで今回は以下のように対策してみました。 高さ100%のbody要素にposition: relative;を指定する。 ボックスの縦横にmin-width、
CSS で画面中央表示のサンプル | [ VERSION510 ]
少し前に出た話題だけど、CSS (だけ) でブラウザのウィンドウの中央にボックスを表示させてみる。元ネタは以下の記事より。 CSSでDivを天地左右中央に配置する方法『locate div at the center vertically and horizontally』 | CREAMU 以下のリンク先にサンプルがあります。 sample.html 仕組みとミソ 元記事のように、ネガティブマージンを使用すると、中央配置したボックスの大きさよりブラウザのウィンドウが小さくなると、右上半分が消えてしまいます。 また position: static; な body 要素に絶対配置すると、ブラウザのウィンドウを小さくしていくとうまいこといかない (画面の中央に表示されない) 現象がみられました。ということで今回は以下のように対策してみました。 高さ 100% の body 要素に posit
小さなビジネスの売上を2倍にするブログ
こんなに安くしているのに、まだ 「あなたのその値段、高くない？」 って言われる。 そんなことに苦しんでいませんか？ 「仕事を回してやる」から「お願いします」へ この記事を書いているワシ自身、1999年に「ホームページ制作業」として創業して以来、ながいあいだ「買い叩かれる」存在でした。 値下げを要求されたあげくに注文がもらえなかったり、雑用を押し付けられたり。 今では「仕事を回してやる」といった上から目線で接してくるお客さんは少なくなりました。 いまでは「お願いします」と言ってもらえるようになりました。 いまは中小企業や、ひとりビジネスの「ちいさな経営者」の方々に「売上をアップするお手伝い」をするコンサルタントとして活動しています。 パソコンの前に座って売上を作れる状態に さらに、2020年の「感染症さわぎ」以来、仕事のやりかたを「オンラインビジネス」にシフトして、ほとんど外出せずに売上を継
ブログ講座 | バサラなブログ
名古屋市で中小企業や起業家等の「小さな会社のホームページ」の作成／運営をお手伝いしています。中小企業の方々に向けて、ホームページ制作やホームページ運用に役立つ情報を発信のほか、プライベートなことなども書いていきたいと思います。 数日前、このブログページの上部を 「Amazonインスタントストア」へのリンクから 「GoogleAdsense」に変更し、 インスタントストアへのリンクはサイドメニューに移しました。 どちらも、ブログやホームページに広告を貼り付けて、 お小遣いを稼ごう、という主旨のサービスです。 まぁ、稼げたとしても月数千円がいいところですがね・・。 Googleの提供するGoogleAdsenseは、 サスガに検索エンジンのGoogleが提供するだけあって、 機能が充実しています。 GoogleAdsenseの広告をブログに貼り付けると、 そのブログに掲載されている話題を自動的
作ろうiモード：XHTML | サービス・機能 | NTTドコモ
iモード対応XHTMLで書いたページをインターネットからアクセス可能なウェブサーバに置いていただくだけでXHTMLに対応したFOMA iモード対応機種から見ることができます。 ドコモではお客様のホームページを用意するようなサービスは提供していません。 「ダイレクトキー機能」を使用したアクセスキーは「0」〜「9」、「#」、「*」が使用できます。 iモード対応XHTMLは、WAP Forum（現OMA <Open Mobile Alliance>）のXHTML-MPをもとにiモード対応HTMLとの互換性を意識して策定したものです。 WAP2.0の主な機能のすべてに対応しています。 基本的にiモード対応HTMLとのデュアルブラウザです。 文字コードはShift-JISおよびUTF-8、画像はGIFおよびJPEGに対応しています。 スクリプト言語には対応していません。 半角カナが利用できます。
モバゲーのような携帯サイトを作るための12のTips 携帯ホームページを作ろう！ -ちょっと詳しいモバイルサイトの作り方-
当ブログが携帯サイト作成法に関する記事をかいていることから、読者の方から、 『モバゲーのような携帯サイトを作るためにはどうしたらいいんですか？』 っていう質問を最近良く受けます。 おそらく、モバゲーがとても有名で、ある種モバゲーが携帯サイト界のデファクトスタンダードのような 位置づけになってきているのでしょうか。 確かに、携帯サイトを作ってきている身としても、 モバゲーのサイトデザインにするには、結構難しいことも多いし、学ぶことも多い。しかし、最近の携帯サイトは、実機からしかアクセスできないようになっていて、PCからコードを覗くことができないことも多く、学ぶことも難しいようです。 ということで、今回は実際にモバゲータウンに携帯でアクセスして、携帯の画面を見ながら、デザインを真似て新しく自分なりに作ってみましたので、そこから得た経験をTipsとして公開したいと思います。 ちなみに、左のスクリ
携帯サイトの作り方 第1回 作成方法の基礎 [ホームページ作成] All About
携帯サイトの作り方 第1回 作成方法の基礎携帯電話などから閲覧できる「ケータイサイト」を作ってみましょう。携帯端末に搭載されているブラウザに関するいくつかの制約を押さえておけば、あとは簡単に作成できます。まずは、携帯サイト作成の基本をご紹介。 (注) 本記事の解説は、ガラケーサイトの作成方法です。 本記事は、ガラケー(フィーチャーフォン)端末向けのウェブサイトを作成する方法の解説です。スマートフォン端末向けのウェブサイトの作成方法ではありませんのでご注意下さい。スマートフォン向けモバイルサイトの作成方法に関しては、下記の記事などをご参照下さい。 スマートフォン対応サイトを作る際の注意点 レスポンシブ・ウェブデザインの簡単な作り方 レスポンシブCSSで使うブレイクポイントの決め方 モバイルファーストでデザインする際のCSSの書き方 ブラウザの幅に合わせて表示を自動変更するレスポンシブ技12選
![携帯サイトの作り方 第1回 作成方法の基礎 [ホームページ作成] All About](https://cdn-ak-scissors.b.st-hatena.com/image/square/99ea29bf657cd4dbe096c25bd4423077e189e7a5/height=288;version=1;width=512/https%3A%2F%2Fimgcp.aacdn.jp%2Fimg-a%2F1200%2F900%2Faa%2Fgm%2Farticle%2F2%2F3%2F9%2F9%2F9%2F201610192029%2Ftopimg_original.jpg)
CSSのfont-family：ヒラギノとＭＳ Ｐゴシックとメイリオの悩ましい関係 : webデザイナーのナナメガキ
CSSでのfont-familyの指定がとても悩ましい。文字コードによって表示が変わったりするし、イレギュラーケースまで想定すると煩雑なコードになってしまう。ちょっと整理しながら考えてみる。 まず、font-familyを何も指定しないと、だいたいのブラウザではデフォルトで設定されているフォントで表示されるのだが、文字コードがUTF-8だとWindowsのIE6で英数文字が「Times New Roman」になってしまう。※文字コードがShift_JISやEUC-JPの場合はデフォルトのフォントで表示される。 それでは例えば総称ファミリー名（generic-family）である「sans-serif」のみ指定してみると、WindowsのIE6では文字コードがShift_JIS・EUC-JPの場合は「Lucida Sans Unicode」で、UFT-8の場合は「Arial」で表示されてしま
携帯ホームページを作ろう！ -ちょっと詳しいモバイルサイトの作り方-
さっそく、読者の方から、「iモードブラウザ」が「2.0」になりましたが、 携帯サイト市場としてすぐに対応は必要ですか？ というご質問を頂いたので、今更ではありますが僕なりの見解をお伝えしますね。 結論から言うと 「もちろん動向をウォッチしていくことは必要だが、焦ってすぐに対応する必要はない」 と思います。 iモードブラウザ2.0がドコモ新機種（昨年の夏モデル）に搭載されたとき、 技術系のブログではいち早く過去のブラウザバージョンとの違いを比較した情報を伝えていましたが、 私はその情報はもちろん作り手として知る必要はあると思うんですけど、 おそらく皆さんが思っているのは、そうではなくて、 じゃぁすぐに対応すべきかっていうことだと思うんです。 確かに携帯サイト業界のトレンドや動向は変化が早いと言われますが、 XHTML+CSSベースで携帯サイトが作れるようになった今でも、 核となる制作ノウハウ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
jQueryでマウスオーバー時に画像を表示する imgPreview
http://depthcode.com/2010/07/fnav.html
ブラウザによるCSS反映の違い | イラストレーター's ファイン ライフ