ホームページビルダー・グレート初心者講座

グレート初心者講座トップへグレート初心者講座 小技集へグレート初心者講座≠ヨグレート初心者講座 質問掲示板へ

HTML版 過去ログ
| 掲示板を見る | ホームに戻る | ワード検索 | 過去ログ |   

CSS

日時: 2011/01/17 07:09
識別: IDQC1lSwlFjyw
名前: CSS

@charset "Shift_JIS";

/* ========BASIC======== */

html{
margin:0;
text-align:center;
padding:10px;
background:url(image/2bg-toku-tukikukan-white-ao.jpg) no-repeat right fixed ;
}

body{
font-size : 0.8em;
font-family : Verdana,Osaka,'MS UI Gothic';
color:#333;
line-height:150%;
margin:0;
letter-spacing:0.05em;
background:url(image/10xmas-w03.jpg) 110% 125% no-repeat fixed;
}

a{
color:#899501;
text-decoration:none;
}

a:hover{
color:#ffffff;
cursor:e-resize;
}

image{
border:0;
}

br{
letter-spacing:normal;
}

/* タイトル */
h1{
font-size:16px;
color:#339999;
font-weight:bold;
text-align:center;
margin:30px;
}

/* ========TEMPLATE FRAMEWORK======== */
div#wrapper{
background:url(image/bg-toku-tukikukan-white-ao.jpg) no-repeat fixed ;
margin:0;
text-align:center;
padding:10px;
}

/* ========MENU CUSTOMIZE======== */
div#menu{
}

div#menu ul{
list-style:none;
padding-left:90px;
margin:30px 0;
}

div#menu li{
display:inline;
padding-right:30px;
}

/* ========CONTENTS CUSTOMIZE======== */
div#contents{
}

div#contents h2{
background:url(image/judges-crest-silver.gif) no-repeat;
padding:3px 3px 3px 45px;
border-bottom:1px #899501 dotted;
font-size:1em;
font-weight:normal;
line-height:29px;
margin:0;
}

div#contents p{
margin:0;
padding:0.5em 0 2em 0;
}

div#contents strong{
color:red;
font-weight:normal;
border-bottom:1px dashed #999;
}

/* ========FOOTER CUSTOMIZE======== */
div#footer{
font-size:0.9em;
text-align:center;
padding:10px;
border-top:5px double #899501;
}




次の二つ

html{
margin:0;
text-align:center;
padding:10px;
background:url(image/2bg-toku-tukikukan-white-ao.jpg) no-repeat right fixed ;
}



/* ========TEMPLATE FRAMEWORK======== */
div#wrapper{
background:url(image/bg-toku-tukikukan-white-ao.jpg) no-repeat fixed ;
margin:0;
text-align:center;
padding:10px;

の部分に注目してください
今背景の左右に画像ひとつずつ使おうとしています
cssでbodyとhtmlを使うと解決するとのことで早速ためしてみたものの
確かに成功したのですが、左の画像にブレ(ページ全体と画像に白い隙間が出来る)がおきて、右は無事です。
右の画像(htmlの部分すべて)を外すと左のブレはなくなります
この問題の解決方法をご存知ありませんか?
あとこの二つの画像は左右対称です
その二つの高さ(横幅は大丈夫です)をきっちりそろえる方法はなんでしょうか?
どうか、お教えください

当方初心者で、内容に関係のない余計な改行等があるかもしれませんが、どうかお許しください

Re: CSS ( No.1 )
日時: 2011/01/17 15:25
名前: マルチポストですね

マルチポスト

http://bbs.j-ns.com/topics.php?num1=3537
Re: CSS ( No.2 )
日時: 2011/01/17 23:18
名前: CSS

あっ
一日待って、自分のだけでなく他の投稿にも返事が見られなかったので
他の掲示板(ここ)にも書いてみたのですがダメでしたか?
申し訳ありません

厚かましいですが、どちらかにでもアドバイスをいただけるとうれしいです
削除が出来ないので・・・
Re: CSS ( No.3 )
日時: 2011/01/18 19:07
名前: CB

> 厚かましいですが、どちらかにでもアドバイスをいただけるとうれしいです
> 削除が出来ないので・・・
掲示板スレトップに
"質問掲示板の注意事項(必ずお読み下さい)"とあるのですが。
https://aimix.jp/bbsnote.html
ここは(あちらもだったかな)マルチポストは禁止で、あちらを終了宣言するか、こちらを終了宣言するかしてください。

> 左の画像にブレ(ページ全体と画像に白い隙間が出来る)

見せてもらえれば、何か気づく人もいるかもですがねえ。

見せられないというなら、どちらも終了宣言した上で“Yahoo知恵袋”やOKWave系で質問した方がいいかも。

# ここは回答者自体減っているし、忙しいだろうし。
Re: CSS ( No.4 )
日時: 2011/01/18 22:44
名前: CSS

お騒がせして申し訳ありませんでした
私の注意不足でした
もう1つは終了宣言(解決済みに)しました
みせる・・・ですか?

えっと・・・よくわからないんですが、とりあえず公開スペースをまだ借りてなくてリンクとかは出来ないです
HTMLを乗せます

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis" />
<title></title>

<link href="style.css" rel="stylesheet" type="text/css" />


</head>



<body>
<div id="pagebody">

<div id="header">

<h1><a href="index.html"></a></h1>
</div>




<div id="wrapper">

<div id="menu">

<div id="mainpict">
<img src="images/photo.jpg" alt="" width="185" height="143" />

</div>

<ul>
<li><span class="color">◆</span><a href="index.html"> HOME</a></li>
<li><span class="color">◇</span><a href=""> FREE</a></li>
<li><span class="color">◆</span><a href=""> FREE</a></li>
<li><span class="color">◆</span><a href=""> FREE</a></li>
<li><span class="color">◆</span><a href=""> FREE</a></li>
</ul>


</div>
<div id="main">

<h2 id="page_title">Page Title</h2>

<h3 class="bar"><span class="color">◆</span> 小見出し1つ目</h3>

<p class="text"><br />
</p>


<table width="523" border="0" cellspacing="1" cellpadding="6" class="table_border">
<tr>
<td width="165" class="cell1"></td>
<td width="331" class="cell2"></td>
</tr>
<tr>
<td class="cell1"></td>
<td class="cell2"></td>
</tr>
<tr>
<td class="cell1"></td>
<td class="cell2"></td>
</tr>
</table>

<h3 class="bar"><span class="color">◆</span> 小見出し2つ目</h3>

</div>
</div>


<br clear="all" />

</div>

</body>
</html>

これとCSSを組み合わせたら起こった現象です
メモ帳にコピーすれば見れると思います・・・
どの画像でも起こったので画像は大丈夫だと思います
私の不注意でお騒がせして本当に申し訳ありませんでした
どうか、よろしくお願いします。
べっ、べつに ( No.5 )
日時: 2011/12/09 20:48
名前: ぷぅにゃん
参照: http://ktjg.net/

女ヤッて金もらえるの?(人・ω・)$ http://ylm.me/index.html
女性用風俗 ( No.6 )
日時: 2012/06/18 06:10
名前: 流奈
参照: http://www.44m4.net/

ソープランドを超えたサービス実施中!(*´ω`) http://fgn.asia/

ホームページビルダー・グレート初心者講座 Copyright © 2002-2005 aimix All Rights Reserved