CSSが破綻する4つの理由 - Qiita前回の「破綻しにくいCSS設計の法則 15」は思いがけず大変なご好評をいただきました。ただ書いた当人としては、まとまりに欠けていたように思えましたので、今回はもう少し本質的なところを書いてみたいと思います。 CSSとは実際のところ何か CSSが破綻する理由 破綻しないCSS設計とは 1. CSSとは実際のところ何か CSSはJSONと同様にシンプルなフォーマットで、基本的には以下のような構造になっています。
htmlをiPhoneに対応させる
そもそもwidthは ・縦:portlaitモード（320px）約1/3 ・横:landscapeモード（480px）約1/2 （1）metaタグにviewportを使う <meta name="viewport" content="[プロパティ]=[値](, [プロパティ]=[値])"> initial-scale 倍率の初期値 乗数で指定（例：120%の場合は1.2） minimum-scale 倍率の最小値 乗数で指定 maximum-scale 倍率の最大値 乗数で指定 user-scalable 拡大縮小の可否 （ye/no） <meta name="viewport" content="width=device-width" /> デバイスにあわせる（スクロール分の余白ができてしまう） <meta name="viewport" content="width=320; init
スマフォサイトでよく見るパーツのコードサンプル集 | 07design.blog
最近スマートフォンサイトの案件が増えてきました。そこで、個人的によく使いそうなコードをEvernoteにまとめたりしていたのですが、 まだまだスマフォサイト構築のノウハウ記事も少ないですし、共有しておこうと思います。…最近スマートフォンサイトの案件が増えてきました。 そこで、個人的によく使いそうなコードをEvernoteにまとめたりしていたのですが、 まだまだスマフォサイト構築のノウハウ記事も少ないですし、共有しておこうと思います。 すべてのデモ（chromeなどのwebkit系ブラウザまたはスマートフォン実機でご覧ください） download ヘッダーの右にメニュー <h3>ヘッダーの右にメニュー</h3> <!--ヘッダーの右にメニュー--> <header class="header1"> <h1><a href="#"><img src="title.png" alt="SIT
たった1行！スマホサイトのコーディング時に役立つ小技8（サンプルあり） - Design Color
もくじ 幅をデバイスサイズに合わせる スマホを横にしたときに文字が大きくならないようにする 電話番号に自動的にリンクが付かないようにする リンクを押したら電話をかけられるようにする リンクを押したらGoogleマップアプリを起動させる リンクエリアを広げる paddingやborder分を気にせずwidth/heightの数値を指定する 長い文字列でも途中で改行させる 1.幅をデバイスサイズに合わせる まずはスマホサイトを作るときの基本ですね。サイト幅をデバイスの幅に合わせてあげるには、以下の一行だけで対応出来ます。 <meta name="viewport" content="width=device-width,initial-scale=1.0"> サンプル 2.スマホを横にしたときに文字が大きくならないようにする スマホを横にすると、解像度が変化すると共に文字サイズも大きくなってし
ScaleOut | Supership
「ミライリアルの幸せを、デジタルの力で創る」ことを目指すSupershipグループの社内報です。日々の出来事、メンバーの働く様子や声、未来への想いなど、Supershipグループの”Be Super”なストーリーをみんなでシェアしていきます。
FINDJOB!終了のお知らせ | FINDJOB!
FINDJOB! 終了のお知らせ 2023年9月29日にFINDJOB!を終了いたしました。 これまでFINDJOB!をご利用いただいた企業様、求職者様、様々なご関係者様。 大変長らくFINDJOB!をご愛顧いただき、誠にありがとうございました。 IT/Web系の仕事や求人がまだ広く普及していない頃にFind Job!をリリースしてから 約26年間、多くの方々に支えていただき、運営を続けてまいりました。 転職成功のお声、採用成功のお声など、嬉しい言葉もたくさんいただきました。 またFINDJOB!経由で入社された方が人事担当になり、 FINDJOB!を通じて、新たな人材に出会うことができたなど、 たくさんのご縁をつくることができたのではないかと思っております。 2023年9月29日をもって、FINDJOB!はその歴史の幕を下ろすこととなりましたが、 今後も、IT/Web業界やクリエイティブ
商用利用無料・バックリンク不要、ミニマルで汎用性に優れた100%ベクターのアイコン素材 -Joel Siddall
商用利用無料・バックリンク不要、ミニマルで汎用性に優れた100%ベクターのアイコン素材 -Joel Siddall
知らないといつまでたってもHTMLとCSSが理解できない暗黙の仕様4つ
調べる。 備忘録としてwebやデザインについて調べたり 新しく知ったことなどを書き残していくカテゴリです。
[ajax] JavaScript版 RSSリーダー設置手順
JavaScript と HTML テンプレートをコピー＆ペーストするだけで、 あなたのホームページに右のような ajax 版 RSS ビューワを設置できます。 ※ただし、Internet Explorer と Firefox が対象です。 それ以外のブラウザでは正しく表示されないかもしれません。 ⇒Opera／Safari 2.0／OmniWeb でも動きます。 STEP1 使用するライブラリ STEP2 JavaScript コード STEP3 HTML テンプレート TIPS RSS 2.0、W3CDTF、件数制限 コメントはこちらへ トラックバック 設置手順は以下の通りです。 STEP1 2つのファイルをダウンロードして、 あなたのホームページのHTMLファイルと同じディレクトリか 他の .js ファイルと同じディレクトリにアップロードしてください。 jkl-hina.js jkl
静的ページにRSSを表示させる - GeeklogJpWiki
RSSフィードを表示する RSSを使ってトップページのセンターブロックで新着情報を表示するPHPです。 静的ページPHPのページを作成する際に、「センターブロックに表示」をチェックすると、トップページに表示されます。 //読み込ませたいRSSファイルを指定してください。 $urlrss="http://○○○○○○/○○○"; //各項目の説明文の最大表示文字数（先頭から○○文字） $limits=30; $buff=""; $fp=fopen($urlrss,"r"); while(!feof($fp)){ $buff.=fgets($fp,4096); } fclose($fp); $parser=xml_parser_create(); xml_parser_set_option($parser,XML_OPTION_SKIP_WHITE,1); xml_parse_into_str
CSSでリストをグリッド状に並べる：CSS 3分コーディング
CSS（スタイルシート）の色々なテクニックや知識を紹介していく「CSS 3分コーディング」のコーナーです。 はじまりはじまり。 画像などのボックスをCSSでグリッド（格子）状に並べる方法です。table要素は使わず、CSSのみで実現します。 完成品はこんな感じ。 これは、CSSを適用する前はこうなっています。 XHTMLはこんな感じ。 <div id="grid"> <ul> <li><img src="box.jpg" width="80" height="80" /></li> <li><img src="box.jpg" width="80" height="80" /></li> <li><img src="box.jpg" width="80" height="80" /></li> <li><img src="box.jpg" width="80" height="80" />
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IE11（インターネット・エクスプローラー 11）で「Scanstyles does nothing in Webkit/Firefox/Opera」とのダイヤログ表示。 | AVlog
新着記事