WEBデザイン Floatで作ったレイアウトが崩れるのを防ぐには？ 【簡単な事だった】
table.tbl1 td{padding:0;vertical-align:top;} .code1{margin:0 2em;padding:1em;border:solid 1px gray;background:black;colo...
WEBデザイン
WEBデザイン WEBデザイン 【レスポンシブデザイン】スマホ対応サイトの作り方【簡単】
HPをスマホ対応デザインに改造する相談を受けたので、やってみた スマホ対応にする方法は大まかに分けて二種類 #main table#tbl1{margin:0;padding:0;} #main table#tbl1 td{margin:0...
WEBデザイン 【無料素材】 三線 描いてみた
使いたい方はご自由にどうぞ～(´ω｀)
WEBデザイン 【CSS】paddingを超えて枠線いっぱいに線を引くには
padding を指定した領域内に線を引こうとすると、線もpaddingの内側までしか引けません。それを枠線いっぱいに引くには？なんのことやら分かりにくいですね例幅が一定の領域を作り、内側に20pxほど padding を指定しますあいうえ...
WEBデザイン 覚書 AA／顔文字
Wikileaksに掲載された、CIAが蒐集してたという日本の顔文字集ついてた注釈コメントは消してしまったけれど、いくつか意味が間違ってるのもあるような・・・(笑) ¢‿¢ ©¿© o ª{•̃̾_•̃̾}ª ¬_¬ ¯＼(º_o)/¯ ¯...
WEBデザイン WEBフォントで手書き風フォントを使ってみる
手書き風フォントで｢ふい字｣というものがあります。 ｢ふい字置き場｣ ふい字置き場。 フリーの手書きかなフォント｢ふい字｣のサイト。２バイトで打ててシフトJIS第二水準漢字まで使えます。可愛くも綺麗でもないですが、しいて言えば普通っぽさが特...
WEBデザイン 背景色・画像・テキストを半透明に
すぐ忘れてしまうので覚書 画像・テキストを半透明にするには ⇒ スタイルシートで opacity を指定 style="opacity: 1;" style="opacity: 0.7;" style="opacity: 0.3;" （写真...
WEBデザイン 画像を加工せず、一部だけ切り取って表示する方法 で、スマホで表示すると位置がズレてしまう問題
CSS（スタイルシート）を使って画像をクロップして表示しても、スマートフォンで表示すると位置がおかしくなってしまう問題で悩んでいたけれど、解決したのでメモ。スマートフォン用のテンプレートには、大きい画像をスマホの画面内に収めて表示させるため...
WEBデザイン 画像を加工せず、一部だけ切り取って表示する方法
■写真を加工することなく、WEB上の表示だけで一部だけを切り取って表示する方法以下の写真を例に （写真：茜さや／PAKUTASO） 切り取りたい大きさの枠を用意します。 写真より枠が小さい場合、そのまま写真を表示すると画像が枠をはみ出してし...
WEBデザイン 定義リストにマーカーをつける
ul 要素、ol 要素、l i要素は list-style-type を指定することができるけれど、では同じリスト要素である dl（定義型リスト）には マーカーをつけることはできないのか？ ⇒ display プロパティで list-ite...
WEBデザイン リストのマーカーが変更できなくてハマる
【覚書】listのマーカーを変更するにはを書きましたが実はリストのマーカーが変更できなくて、かなり、ハマった(笑)こういうやつソース<ul><li>りんご</li><li>みかん</li><li>こたつ</li><li>餅</li></ul...
WEBデザイン 【覚書】リスト(<ol> <ul>)のマーカーを変更するには
すぐ忘れてしまうので覚書 <ul>や<ol>などのリスト形式で、列挙されるデータのマークの種類を変更するには <li>にスタイルで list-style-type を指定する。 ソース <style><!-- .ltsq { list-st...