Home 
CSSを使ったタブメニュー
No,214 comment 0
よくトップページなどに使われているタブメニューをcssだけで作ってみました。この例ではHPを4ページ作ってそれぞれリンクを貼りました。cssで.box .box2それぞれを float:left; で横並びにし.box2の下線をなくしてそれぞれのページのメニューのリンクに当てます。DEMO この部分はインラインフレームを使用しています。 続きはそれぞれのページです...
Read More
cssを使って「文字にマウスオーバーで画像を現わす」
No,216 comment 0
「ブログ上の文字」という文字にマウスオーバーすると画像が現れます。ブログ上の文字いつつばのクローバースタイルシートにcssを書き込んで記事を書いていると時の経過と共にどれがこのためのcssか解らなくなってしまいます。ここにHTMLとCSSを関連して記しておきます。HTMLは<a class="thumbnail" href="リンク先のアドレス">ブログ上の文字<span><img src="画像のアドレス" /><br />ここに画像...
Read More
リンク文字の背景領域でもクリック可能にする
No,217 comment 0
エントリータイトルなどリンクの文字だけではなく背景も含めてクリックできるようにするにはHTML<h2>エントリータイトル</h2>CSSh2 {font-size:20px;}h2 a{display:block;border-left: 20px solid #ccc;border-bottom: 1px solid #ccc;border-right: 1px solid #ccc;border-top: 1px solid #ccc;background: #f0f8ff;padding: 10px;}DEMO水色のところ全体がクリックできるDEMO エントリータイトル DEMO...
Read More
横並びのDIVはウインドウサイズで変化
No,219 comment 0
tebleタグでは「width:100%;」など指定が必要ですがDIVタグ では[float:left;]で横並びさせているのに、ウィンドウサイズが狭くなれば、ひとりでに縦並びになるようです。DEMO12345HTML<div class="box">1</div><div class="box2">2</div><div class="box">3</div><div class="box2">4</div><div class="box">5</div><br clear=left>CSSはdiv.box {float: lef...
Read More
すごいやつ display
No,227 comment 0
cssにおいてdisplayを使うといろいろとすごいことが起きる。display:block;1.これだと確実に改行されます。2.aに設定すると 文字だけではなく全体がクリック可能に3.そしてコンテンツの表示それに対しdisplay: none;では非表示使い方としては@media screen and (max-width: 960px) {}@media screen and (max-width: 360px) {}などとウインドウの幅を設定するスタイルシートで960pxでは表示 360pxでは非表示。またはそ...
Read More
boxの中で一番上と一番下に文字を入れるには
No,229 comment 0
CSS#box{position:relative;height:400px;border : 1px solid #ccc;}p.btm{position:absolute;bottom:0px;left:0px;}HTML<div id="box"><p>ああああ</p><p class="btm">ああああ</p></div>...
Read More
どりーみー

カテゴリー



recent comment

最新の記事

月別アーカイブ

recent trackback

ブログ内検索

RSSフィード

*最新記事のRSS
*最新コメントのRSS
*最新トラックバックのRSS

TB_People

カレンダー

11 | 2018/12 | 01
- - - - - - 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 - - - - -

ブロとも一覧

ブロとも申請フォーム

この人とブロともになる

リンク

 

カテゴリー

recent comment

最新の記事

月別アーカイブ

recent trackback

ブログ内検索

RSSフィード

*最新記事のRSS
*最新コメントのRSS
*最新トラックバックのRSS

TB_People

カレンダー

11 | 2018/12 | 01
- - - - - - 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 - - - - -

ブロとも一覧

ブロとも申請フォーム

この人とブロともになる

リンク