コピペで使えるシンプルでおしゃれな囲み枠CSSサンプル | office FITPlus-お金とITのお悩みなら横浜のFP事務所へ
アメブロカスタマイズ コラム コピペで使えるシンプルでおしゃれな囲み枠CSSサンプル アメブロでのお知らせ、WordPressサイトでのまとめ、メルマガデザインなど、いろいろな場面で使える囲み枠のサンプルを作ってみました。コピペして活用してみてください。 シンプルな背景色での囲み枠 背景色だけで表現したシンプルだけど使いやすい囲み枠です。文字が見やすいよう淡い色を用意しました。 アメブロの記事下の文章やセミナーのお知らせ枠にどうぞ 枠の中には自由に文章を書きます。 アメブロでの記事内やメルマガで使用する場合＜インラインCSS＞ <div style="padding:20px;width:80%;background:#FEDFE1;border-radius:8px;color:#724938"> アメブロの記事下の文章やセミナーのお知らせ枠にどうぞ<br/> 枠の中には自由に文章を書き
『スマホ用のフォームは「大きく」して使いやすく』
PC用のメールフォームは、スマホで見るとコンパクトに表示されてとても使いづらい～～～。 ということでCSSに記述を足して最適化。 ●html側 <form action="・・・・" method="post"> <p>名前： <input type="text" id="name" name="name"></p> <p>メールアドレス： <input type="email" id="email" name="email"></p> <p>コメント：<br> <textarea id="comment" name="coment"></textarea> <p><input type="submit" id="submit" value="送信"></p> </form> input { width: 100%; max-width: 400px; /* レスポンシブの場合の対策 */
スマートフォンサイト制作時に覚えておきたいCSS 15
スマートフォンサイトを制作する際、個人的に覚えておいた方が良いと思うCSSのプロパティやテクニックをまとめてみました。 自分用の備忘録ではありますが、他のブログ等でも取り上げられていることが多いので、いずれも覚えておいて損はないものだと思います。 普段から制作している方にとっては目新しいのはないと思いますが、まだスマートフォンサイトを制作したことがない方やまだまだ苦手だなと思う方は参考にしてみてください。 UA切り替え・Viewport指定・拡大縮小の有無・電話番号リンクの無効化・ホーム画面用のアイコン指定など、スマートフォンサイトを制作する際に最低限覚えておくべきと思うことは他にも沢山あるんですが、今回はCSSに焦点を当てています。 また、タイトルでは「スマートフォンサイト制作時」としてはいますが、レスポンシブWebデザイン制作時でも頻繁に使うものだったり、PCサイト制作時でもCSS3に
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
