- 締切済み
ＦＣ２のテンプレで質問です。
http://stupid69.blog5.fc2.com/blog-entry-52.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>追加。 ｃｓｓでは、 a img { background-color: #f7f7f4; border-width: 2px; margin: 5px 10px 5px 5px; padding: 10px 10px 50px 10px; border-style: solid; border-color: #e2e2db #c4c4ac #c4c4ac #e2e2db; background-image:url background-repeat:no-repeat; background-position:95% 95%; } こう追加してます。
- みんなの回答 （2）
- 専門家の回答
みんなの回答
- calltella
- ベストアンサー率49% (317/635)
- calltella
- ベストアンサー率49% (317/635)
.polaroid{ background-color: #f7f7f4; border-width: 2px; margin: 5px 10px 5px 5px; padding: 10px 10px 50px 10px; border-style: solid; border-color: #e2e2db #c4c4ac #c4c4ac #e2e2db; background-image:url background-repeat:no-repeat; background-position:95% 95%; } ccsをこれに書き換えて 記事中の写真には <img src="画像" width="xx" height="xx" class="polaroid"/> classはpolaroidだけにする事 他にclass="xx"があったら削除する事 できればＦＣ２で使用しているデザインがわかればもっと簡単にできるかも？
お礼
お返事ありがとうございます。 共有テンプレのsweet-memory なんです。 もっと簡単にできますか？？
関連するQ&A
- FC2のテンプレ
http://stupid69.blog5.fc2.com/blog-entry-52.html ↑のテンプレの右側を使いたいと思ってます。 画像枠をポラロイド風にしたいと思い、前使ってたジュゲムでは、 .pict { background-color: #f7f7f4; border-width: 2px; margin: 5px 10px 5px 5px; padding: 10px 10px 50px 10px; border-style: solid; border-color: #e2e2db #c4c4ac #c4c4ac #e2e2db; background-image:url (); background-repeat:no-repeat; background-position:95% 95%; } ↑これで反映されましたが、Fc2では反映されません。 何が間違ってるのでしょうか？
- ベストアンサー
- ブログ
- CSSの質問です。
親子枠の関係です。 親を縦横300px x 300pxと指定した場合、子に縦横300px x 300pxと指定すると親枠からはみ出るんでしょうか？ <!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-Type" content="text/html; charset=utf-8" /> <title>親子関係</title> <style type="text/css"> <!-- #oya { background-color: #006666; height: 300px; width: 300px; } #kodomo { background-color: #006699; height: 300px; width: 300px; } --> </style> </head> <body> <div id="oya"> <div id="kodomo"> </div> </div> </body> </html> 経験者若しくはプロの方のアドバイスを願います。
- ベストアンサー
- HTML
- Operaでズレない方法をご指導下さい
IE6、firefox1.5ではズレないのですが、 Opera9.1.0では <div id="main">テキスト</div> の箇所が左に1pxズレてしまします。 ブラウザの横幅を大きくしたら小さくしたりすると、 ズレない場合もあるのですが、最大にすると1pxだけズレます。 ズレない良い方法がありましたら、どうか教えて下さい。 <!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-Type" content="text/html; charset=shift_jis" /> <title>無題ドキュメント</title> <style type="text/css"> <!-- body { background-image: url(bg.jpg); background-repeat: repeat-y; background-position: center top; margin: 0; } #main { background-color: #00FFCC; width: 700px; margin:0 auto; } --> </style> </head> <body> <div id="main">テキスト</div> </body> </html>
- 締切済み
- HTML
- XML宣言について
htmllintでエラーチェックをしたら、 <!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" xml:lang="ja" lang="ja"> にはXML宣言をいれろとでたので <?xml version="1.0" encoding="Shift_JIS"?>を入れました。 しかし、下記cssの設定でセンター揃えの設定をしていたのに 左よりになってしまいました。 XML宣言を取ると元のセンター揃えに戻りましたがXML宣言はいれない 方がよいのでしょうか？入れてもセンター揃えになりますか？ css---------------ーーーーーーーーーーー * {1 margin: 0; padding: 0; } body { margin: 0px; padding: 0px; background-color:#f0fbff; height:100%; font-size: 13px; } html{ height:100%; } #wrapper { background-color:#fff; margin:0px auto; padding:0px; width:848px; height:100%; min-height:100%; border-left:1px solid #b8b8b8; border-right:1px solid #b8b8b8; } body > #wrapper { height:auto; }
- ベストアンサー
- HTML
- CSSのリスト表示
リストの表示ですが、li a で上下と左にpaddingを入れたいです。 IEではOKなのですが、Firefoxでは右に背景色が飛び出てしまいます。 どこを直したら良いでしょうか。 <?xml version="1.0" encoding="Shift_JIS"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> で組んでいます。 #category { width: 180px; float: left; } #categoryt ul { border-top: 1px solid #999999; } #category li { border-bottom: 1px solid #999999; } #category li a { display: block; width : 100%; padding: 5px; background-color: #F6F6F6; text-decoration:none; color: #000033; } #category a:hover { background-color: #DBE7EE; color: #003366; } --------------------- <div id="category"> <ul> <li><a href="#">AAA</a></li> <li><a href="#">BBB</a></li> </ul> </div>
- ベストアンサー
- HTML
- hタグ 印刷時の背景画像
おせわになります。 hタグで背景画像を使用しており、 プリント表示させると、その背景画像が消えてしまいます。（IE6、IE7） プリントアウト時も同じように印刷させたいのですが、 対策はありますでしょうか。 ※今の段階でどうしても不可能な場合は、 media="print"指定で、border-bottomで対応しようと考えております。 ▼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-Type" content="text/html; charset=shift_jis" /> <title>test</title> <style type="text/css"> <!-- h1 { padding-bottom:10px; background:url(http://www.geocities.jp/ajax3210/dotline.gif) repeat-x bottom; } --> </style> </head> <body> <h1>テスト見出し</h1> </body> </html>
- ベストアンサー
- CSS
- cssに関して
<!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-Type" content="text/html; charset=utf-8" /> <title>無題ドキュメント</title> <style type="text/css"> <!-- #box { height: 100px; width: 700px; border: 1px solid #996600; } .comment { height: 50px; width: 300px; float: left; margin-top: 10px; border: 1px solid #993366; } --> </style> </head> <body> <div id="box"> <div class="comment"> comment </div> <div class="comment"> comment </div> </div> </body> </html> --------------------------------------------------------- boxという枠の中にcommentの子枠を入れてます。 comment枠の上に10pxの空間を入れたいのですが、上記xhtmlとcssで書き方はＯＫだと思います。 しかし疑問が残ります。 本来はboxにpadding-top:10pxとすべきなんでしょうか。 それとも上記のとおりで正解なんでしょうか。（commentにmargin-top：10px） ある程度経験のある方か、お詳しい方にご判断願いたいと思います。 なぜこのような質問をするかというと、時々Adobe Dreamweaver CS3で、ＩＥ６では正しく表示されないとか、マージンレフトがどうのこうのと出るからです。（ＩＥ６の人はほとんどいないと思いますが、なんかしっくりこないんです・・・） よろしくお願いします。
- ベストアンサー
- HTML
- css 初心者です。（壁紙について
外部cssにて、壁紙にある画像を一枚壁紙にしようと思い、以下の記述を行いましたが、なぜかすべての画像の範囲が収まらず、一部Y軸方向に画像が現れるだけです。どのような事が現なのでしょうか？お心当たりございましたら、お願い致します。 //css部分// @charset "UTF-8"; /* CSS Document */ p:hover { padding:10px; border:1px dotted #ff0000; color:red; } a:hover{color: blue;} h1:first-line{color:green;} p.sample1{color: red;} p.sample2{background-color:#3366ee;margin:30px 20px;padding:45px 50px} p.sample3{background-color:#ff7799;margin:-70px -40px;padding:70px 100px} p.sample4{background-color:#33bb77;margin:-70px -2px;padding:70px 100px} p.sample5{background-image: url("akete.jpg"); bakcground-repeat:no-repeat; background-attachment:fixed; } //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-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <title>Untitled Document</title> <link rel="stylesheet" href="begin.css" type="text/css" /> </head> <body> <p class="sample5">あれ？画像欠けてない？</p> </body> </html> 以上をよろしくお願いします。
- ベストアンサー
- HTML
- DreamWeaverでのスタイルシート適用後のプレビューについて
最近やっとDreamWeaverを購入してテーブルからCSSデザインに 乗り換えようと奮闘中のものです。 外部スタイルシートに div#container { background: #ffffff; padding: 20px; margin: 10px 30px; border: 2px solid #999999; } と書き、 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-Type" content="text/html; charset=Shift_JIS" /> <link href="/test.css" rel="stylesheet" type="text/css" /> <title>test</title> </head> <body> <div id="container"> test web site </div> </body> </html> と書きプレビューしてみたのですがスタイルシートが 適用されません。 デザインビューでは適用されているのですが、、、 何が原因なのでしょうか?
- ベストアンサー
- ホームページ作成ソフト
- CSSで余白とパディングに”０”を指定したのに上部に余白ができてしまう
DREAMWEAVER8で作成しているのですが、ヘッダーの上部にCSSで背景としてグラデーション画像をいれてます。 そして、<h1>でロゴ画像を入れると何故かヘッダーのグラデーション背景の上に20ピクセルぐらいの空白が出来てしまいます。 IE6では空白がないのですが、FIREFOX2だと空きます。 分かる方いらっしゃったら教えて下さい。 ソースはこれです↓ 【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-Type" content="text/html; charset=shift_jis" /> <title>無題ドキュメント</title> <style type="text/css" media="all">@import url("school2.css");</style> </head> <body> <div id="wrapper"> <div id="header"> <h1><img src="images/Logo03.gif" width="310" height="90" /></h1> </div> </div> </body> </html> 【css】 body { background: #E0FFCE; text-align: center; margin: 0px; padding: 0px; font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3"; } #wrapper { text-align: left; margin: 0px auto; padding: 0px; height: 800px; width: 800px; border: 1px solid #009999; background: #FFFFFF; } #wrapper #header { background: url(images/Backheader3.gif) no-repeat; margin: 0px; padding: 0px; height: 120px; border-bottom: 6px double #009999; } #wrapper #header img { margin: 0px; padding: 0px; }
- ベストアンサー
- ホームページ作成ソフト
お礼
ご回答ありがとうございました。 感謝します。