｜
29
2015
今までブログの最上部に他のページのリンクを貼っていたんですが
昨日思い立って文字に角丸の背景をつけてみました。
<style>
.clear { clear:both; }
.clear hr { display:none; }
</style>
<p class="admin">
<a href="<%url>" onfocus="this.blur();" class="nonborder"style="text-decoration: none" title="ホーム"><div style="padding:5px 10px;font-weight:bold;background: #f3f1ea; color: #fff; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;width:36px; float:left;"onmouseover=this.style.backgroundColor='#e5e1d2';
onmouseout=this.style.backgroundColor='#f3f1ea'; >ホーム</a></div>
・
・
</p></ul>
<div class="clear"></div>
ピンクの部分がメニューバーを横並びにするタグ。
緑が角丸背景のタグ。f3f1ea が背景の色。
5px が角丸の半径。36px が背景の長さ。文字数によって数値を変えてあります。
黄色の部分が今日やってみたオンマウスで背景の色が変わるタグ。
オンマウスで表示される背景の色を e5e1d2 にしてみました。
その次の f3f1ea は緑のところで変えた色と同じ色にしました。
あくまで私が自己流でやっている事なのでもっと良い方法があるかもしれません。
参考にさせて戴いたページ
ボタンに触れると色が変わる
色見本と配色サイト - color-sample.com
HTML5で文章に角丸の背景をつける方法
今日の調子
今朝4時くらいに足がつりまして…しばらくベットサイドで顔をしかめてましたが
治ったのでトイレに行って寝たんですが、5時すぎにまたつって…痛くて。
ずーっと寝られず、マクタロウのお弁当を作って送り出して、あまりに眠いし
体調悪いので二度寝！気がついたらお昼でした。
やっぱり冷えるんですかねえ。靴下＋レッグウォーマーしてるんですけどねえ。
今日の更新
マクタロウとふたりで運営する「のほほん本舗」トップページ：今日の空
「日刊のほほん本舗」今日の空の全景写真のブログ
「スター・ウォーズの部屋」ブログ更新しました。
← クリックして貰えると大変喜びます！
