2012-05-13

default_2007_diary.cssの変更

default_2007_diary.cssを次のように変更

#diary_content .bar3{
width: 10em;
padding-left : 7.5em;
text-indent : -7em;
}

を追加しました。

投稿者 時刻: 0 件のコメント:

2011-05-09

CSSの変更

鉄爺（てつおんじ）の部屋

管理者の希望により行間を狭くしました

.post p {
margin:0 0 .75em;
/* Updated by: GGIW
----------------------------------------------- */
line-height:1.2em;/*line-height:1.6em;*/
}
投稿者 時刻: 0 件のコメント:
ラベル:

2010-05-26

CSSの変更

今まで使用してきた
default_2007_00.css
と
default_2007_ggiwfish.css
を
default_2010_00.css
と
default_2010_ggiwfish.css
に変更し一部に適用

xhtmlを整理
公開当初から本文インデントのために使用していた
<div id="layer1" class="article_01">
を
<!--div id="layer1" class="article_01--">
、と使用中止し
< div id="main_contents">
に
/*html > body */#main_contents p{
font-size: 100%;
text-indent: 1em;
line-height: 1.5em;
}
/*html > body */#main_contents br{
clear: both;
}
を適用する。
また、
本文中イメージ表示領域に
div.img_box_left{
clear : both;
float: left;
}
div.img_box_right{
clear : both;
float: right;
}

使用した後表示が乱れるためクリアーする
.float_clear{
clear : both;
}
を
< br class="float_clear" / >
として、クリアーしていたものを

#main_contents br{
clear: both;
}

、としてファイルサイズの減量と、入力の省力を図る。
投稿者 時刻: 0 件のコメント:

2008-10-14

< li >　タグのバグ

~ieWin6　には、< li >　タグの外側（要素の前後）に改行を使いCSSで成形すると
隙間が入ってしまう時がある。
しかし、
タグの内側で改行を行うとうまくいく。

つまり、少し妙ですが

< ul >
　< li > あ < /li > < li
　>　い　</li >
< /ul >

のように記述する。
投稿者 時刻: 0 件のコメント:
ラベル: , , , , ,

2008-10-13

xHtmlの見直しー０２

見直し開始しました。

局所的処置（つまり、ニゲ）ただけのサイトは、

不要な
　< div >
　< /div >
が、多い。

まずは、ネストされた内側から削り取ることにする。
投稿者 時刻: 0 件のコメント:
ラベル: , ,

2008-09-15

コピーライトを追加

コピーライトを

< p style="text-align: center;" > < strong style="font-size: 50%;" lang="en" > Copyright © 200?-2008 ggiw </strong ></p >

として、表示
投稿者 時刻: 0 件のコメント:
ラベル: ,

2008-07-05

xHtmlの見直しー０１

２００３年に　HTML 4.01 Strict　でサイトを立ち上げ
２００５年に　XHTML 1.0 Strict　に移行しましたが

局所的処置を行っただけのサイトを根本的に見直してみようと考えている。
投稿者 時刻: 0 件のコメント:
ラベル:

2008-04-16

ggiw_mobile の CSS 変更

１．投稿日の表示を大きめに変更し

h2.date-header {
padding-top: 15px;
color:$footercolor;
padding-bottom:0px;
margin-bottom:0px;
font-size: 120%/*90%*/;/*update by ggiw*/
}


２．投稿の上部と下部に若干の隙間を設けました

.post-footer {
color:$footercolor;
margin-top: 30px;/*update by ggiw*/
margin-bottom: 30px;/*update by ggiw*/
}
投稿者 時刻: 0 件のコメント:

2007-09-25

ＣＳＳの変更

The Great Genkainada Iron Works ( Blogger )は、

携帯電話からの投稿が中心となるので、


* Updated by: GGIW
----------------------------------------------- */

p.mobile-photo img{/*vertical_171px_256px*/
width : 12.19047619em;
height: 18.28571428em;
}

を適用しない。
投稿者 時刻: 0 件のコメント:
ラベル: ,

2007-09-09

ＣＳＳの追加

ブログの道のＣＳＳに追加


/* Updated by: GGIW
----------------------------------------------- */

p.mobile-photo img{/*vertical_171px_256px*/
width : 12.19047619em;
height: 18.28571428em;
}

blockquote{
line-height:1.6em;
}
投稿者 時刻: 0 件のコメント:
ラベル: ,

コンテンツの変更

ブログの道と、コンテンツを投稿を統合。
従来からの(x)htmlサイトに関する情報は my site ラベルで管理
ブログに関する情報は myblog ラベルで管理

ブログの道は、個人的備忘録として活用する。
投稿者 時刻: 0 件のコメント:
ラベル: ,

2007-09-02

モバイルからの送信テスト

携帯端末から投稿実験

写真は、今年活躍したニューモデル。
スノーシューラビットでシャックをこさえた極浮力型
鈎も変えたので極耐久型、耐久試験では50匹以上の好成績。

久々の大ヒットでした。

投稿者 時刻: 0 件のコメント:
ラベル:

2007-03-07

(X)HTMLタグの見直し

先日から体調を崩し、昔買った本を読み直しました。
ドキュメントに対する理解のなさに唖然としています。
ディビジョンとパラグラフの使い方が今でもよく理解できていませんでしたが、
これまで使っていなかった

<q>、
と<blockquote>、
と<pre>、
と<code>、
と<dfn>、
と<kbd>、
と<samp>、
と<var>、
と<tt>、
と<abbr>、
と<acronym>、
と<cite>

おおごとです。
投稿者 時刻: 0 件のコメント:
ラベル: ,

2007-02-26

an ultimate weapon for ieMac5.x

先日から、htmlとCSSの修正を行っていましたが。他ではうまくいくのですがieMac5.xでうまくいきません。
うまくいかないというより、大変危険な状態です。
クラッシュしてしまいます。
「プロパティによってはinheritは効きません」と古い本に書いてありました。
早速

{
color: inherit;
}

を

{
/*¥*/
color: inherit;
/**/
}

に変更すると、
何ともなかったように振る舞ってくれます。効きませんじゃありません。
少なくとも「color: inherit;」のときは、大爆発です。
とても危険です。
投稿者 時刻: 0 件のコメント:
ラベル: , , ,

trick for ieWinAll and ~ieMac5.x

特定のブラウザに適用したり、しなかったり。

１．~ieWin6には適用されないが
　　ieMac5.xには適用される

html>body ~ {
　　property:value;
}

２．ieMac5.xには適用されない

~~~{
　　property/**/:/**/value;
}

３．ieWin6.x(Standard)だけには適用しない

~~~{
　　property/**/:value;
}

４．ieWin7とMOSeに適用する

html[xmlns] ~~~ {
　　property:value;
}

５．MOSeだけに適用する

html[xmlns]>/**/body ~~~ {
　　property:value;
}

、ということです。
うまく利用すると、こんなことができます。

例１

html>body ~~~{
　　font-size/**/:/**/xxx;
}

これは、ieWin6.x以下とieMacに適用しない。
つまり、ieWin7とMOSeだけに適用する。

例２

html[xmlns]>/**/body ~~~{
　　font-size/**/:/**/xxx;
}

これは、ieWin7以下とieMacに適用しない。
つまり、MOSeだけに適用する。

ちょっとしたパズルです。
投稿者 時刻: 0 件のコメント:
ラベル: , , , ,

2007-02-25

htmlの修正

htmlの構造を確定する

１．<html></html>


　

２．<body></body>


　　~ieWin5.5対策を採る
　　　

　　　　body{
　　　　 text-align: center;
　　　　}
　　で、センタリングを行い
　　　　#plate{
　　　　 text-align: left;
　　　　}
　　で、#plate要素（全体）の左揃えを行う
　　　

　　

３．<div id="plate"></div>


　　　　各種コンテンツを記述。
　　　　見栄えの全体調整を行う
　　　

４．<div id="head_bar"></div>


　　　　　ヘッドバー。
　　　　　メニューのスキップや、ラベル、ロゴの表示
　　　　

４ー１．<div id="go_to_main_contents"></div>


　　　　　メニューをスキップし本文"#main_contents"へジャンプ。
　　　　　サイトマップの表示（サイトマップは未作成）
　　　　

４ー２．<div id="hb_ggiw_label"></div>


　　　　　ラベルhb_label.jpgの表示
　　　　　「トップページ」
　　　　　　　"http://www.venus.dti.ne.jp/ggiw/"へジャンプ
　　　　

４ー３．<div id="hb_ggiw_logo_02"></div>


　　　　　ロゴhb_logo_02.gifの表示
　　　　　「上鹿川の日々・つりの生活」
　　　　　　　"http://www.venus.dti.ne.jp/ggiw/ggiwfish/"へジャンプ
　　　

５．<div id="head_menu"></div>


　　　　　ヘッドメニュー。
　　　　　各メインへジャンプ。
　　　　　リスト<ul id="head_menu">を使用
　　　

６．<div id="mainContents"></div>


　　　　　額縁
　　　　　"frame"等へ名称変更を行うこと
　　　　

７．<div id="crumbs"></div>


　　　　　　パンくずリスト
　　　　

８．<div id="layer1"></div>


　　　　　　本文の見栄え調整。
　　　　　

９．<div id=""></div>


　　　　　　　空の<div>
　　　　　

１０．<h3 id="main_contents" class="bar3"></h3>


　　　　　　　本文のはじまり。ジャンプの目標になっている。
　　　　　

１１．<div id="div class="img_box_left""><div id="div class="img_box_right"">


　　　　　　　本文中のイメージ表示領域を確保するため使用
　　　　　　　「注意」「コメント」「サイズ」等のクラスを作成すること
　　　　　　

１１−１"img_box_left"


　　　　　　　の
　　　　　　　

　　　　　　　{ float: left;
　　　　　　　  width: 21em;
　　　　　　　  margin-left: 0;
　　　　　　　  margin-right: 1em;
　　　　　　　  margin-top: 0; }
　　　　　　　

　　　　　　

１１−２"img_box_right"


　　　　　　　の
　　　　　　　

　　　　　　　{ float: right;
　　　　　　　  width: 21em;
　　　　　　　  margin-left: 1em;
　　　　　　　  margin-right: 1em;
　　　　　　　  margin-top: 0; }
　　　　　　　

　　　　　　　調整
　　　　　　

１１−３．<div id="img_box_left">


　　　　　　　に内包された"p"

            p{ font-size: 83%;
　　　　　　　　 width: 20em;
　　　　　　　　 margin: 1.67em .3em;
　　　　　　　　 text-indent: 0;
　　　　　　　　 line-height: 1.17em;
　　　　　　　   font-family: sans-serif;}

　　　　　　　の調整
　　　　　　

１１−４．<div class="mycroon"></div>


　　　　　　　の調整
　　　　　　　「曲名」「作詞」「作曲」「編曲」等のクラスを作成すること
　　　　　　

１１−５．<div class="my_song_book"></div>


　　　　　　　「くり返し」等のクラスを作成すること




９９．<div id="footWarning"></div>



default_10.jsで付加される

以上を基本とし、必要に応じ外部スタイルシートを作成、読み込み上書きで調整する。

修正、改良の要点


外部スタイルシート「default_2007_00.css」


基本外部スタイルシートは"default_2007_00.css"とする。
最初に、
@import "default_2007_01.css"命令を行う。

バージョン４には適用可能な宣言だけとすること。

基本的なセレクタ（要素・ＩＤ・クラス）に基本的な宣言（プロパティ・値）だけをすること。

@import "default_2007_01.css"
　　　　・
　　　　・
body{
 width: 45em;
 margin-top: 0;
 background-color: #ffffff;
 color: #000000;
 text-align: center;
}
#plate{
 text-align: left;
}
　　　　・
　　　　・
　　　基本的な宣言
　　　　・
　　　　・

外部スタイルシート「default_2007_01.css」


基本外部スタイルシート"default_2007_00.css"から「@import "default_2007_01.css"」で読み込む。
ieWin、ieMac専用の外部スタイルシートは極力避け、ハックを使用し上書きすること。
ハックの基本は、

body{
 /*width: 45em;*//*default_2007_01.cssで宣言済み*/
 /*margin-top: 0;*//*default_2007_01.cssで宣言済み*/
 margin-left: auto;
 margin-right: auto;
 padding: 0;/*opr body要素の余白を消す*/
 font-size: small;
}
 /* ieWin6.x  and ieWin7の追加*/
 /* replace ieWin5.x~6 with ieWin7. hide from ~ieWin6 */
 html > body{
  font-size: small;
  /* replace ieWin7 with ieMac5.x. for ieMac5.x ¥*//*/
  font-size: small;
  /*End  for ieMac5.x*/
 }
 /* replace ieWin7 & ieMac5.x with MOSe. hide from ieWin7 & ieMac5.x */
 html[xmlns]>/**/body{
  font-size: medium;
 }

に準じ行うこと
投稿者 時刻: 0 件のコメント:
ラベル: , ,

2007-02-24

見栄えだけの調整

cssを修正し、見栄えだけieWin,ieMac,MOSeに対応完了

cssについてはCSSでSiteのtrick 本文を参照のこと。
投稿者 時刻: 0 件のコメント:
ラベル: ,

trick 本文

../diary200y/dialy200ymmdd.html/の本文中の文字サイズを
とりあえず

#layer1 {
width: 43em;
margin-left: auto;
margin-right: auto;
line-height: 140%;
}
/*ieWin6.x  and ieWin7のdiary200ymmdd.html用に追加*/
#plate #mainContents #layer1{
font-size: 110%;
width: 96%;
}
/* hide from ~ieWin6*/
html > body  #plate #mainContents  #layer1{
font-size: 112%;
width: 94%;
/*for ieMac5.x ¥*//*/
font-size: 100%;
width: 100%;
/*end for ieMac5.x*/
}
/* hide from ~ieWin7*/
html[xmlns]>/**/body #plate #mainContents  #layer1{
font-size: 99%;
width: 43em;
}


、としてごまかします。
default_2007_00.cssで使用中止（20100515　変更）
投稿者 時刻: 0 件のコメント:
ラベル: , , ,

default trick

トリックのデフォルト

body{
 margin: 0;
 padding: 0;
 background-color: #ffffff;
 color: #000000;
 font-size: small;
　　　　　　　　　ここに、ieWin6.xに適用する値を書く
}
 /* hide from ~ieWin6*/
 html > body{
  font-size: small;
　　　　　　　　　ここに、ieWin7に適用する値を書く
  /* for ieMac5.x ¥*//*/
  font-size: medium;
　　　　　　　　　ここに、ieMac5.xに適用する値を書く
  /*end for ieMac5.x */
 }
 /* hide from ~ieWin7*/
 html[xmlns]>/**/body{
  font-size: medium;
　　　　　　　　　ここに、MOSeに適用する値を書く
 }


、とするとうまくごまかせます。
投稿者 時刻: 0 件のコメント:
ラベル: , , ,

2007-02-21

htmlの修正を要する

../diary200y/dialy200ymmdd.html/の表示でhtmlの記述が非構造的である。

<div id="mainContents">
<ul id="crumbs">
</ul>
<div id="layer1" class="article_01">
<div>
<h3 id="main_contents" class="bar3">2007年1月3日</h3>

<div id="head_bar">
に
<p><br class="float-clear" / >

修正と再調整を要する。
ieMac5.xで表示が乱れている。
投稿者 時刻: 0 件のコメント:
ラベル: ,
登録: 投稿 (Atom)