.price、.pc、.descの意味を解説｜WEBデザインのタグについて
- .price、.pc、.descとは、WEBデザインのタグのクラス名です。.priceは価格を表す要素に適用され、フォントサイズが10pt、太字のテキストで、文字色が#c00（赤色）になります。.pcはパソコンを表す要素に適用され、フォントサイズが10ptです。.descは説明文を表す要素に適用され、フォントサイズが10ptです。
- .price、.pc、.descは、CSSのクラスセレクタとして使用されます。.priceは価格を表示する際に使用されるクラスで、見出しや注目度を示すために太字や赤色のテキストが使用されます。.pcはパソコンに関連する情報を表示する際に使用されるクラスで、一般的にフォントサイズが10ptとなります。.descは補足説明や詳細な情報のために使用されるクラスで、一般的にフォントサイズが10ptとなります。
- タグのクラス名である.price、.pc、.descについて解説します。.priceは価格を表す要素に適用され、フォントサイズが10pt、太字で、文字色は赤色となります。.pcはパソコンを表す要素に適用され、フォントサイズが10ptです。.descは説明文を表す要素に適用され、フォントサイズが10ptです。これらのクラスは、CSSでスタイルを指定する際に使用されます。
- ベストアンサー
.price の意味がわかりません。
こんにちは、 WEBの勉強をしています。 以下のようなタグ打ちの中で、（雑誌WEBデザインより） a { font-weight: bold; } .price { font-size: 10pt; font-weight: bold; color: #c00; } .pc { font-size: 10pt; } .desc { font-size: 10pt; } の箇所の、.price 、.pc、 .descの意味がわかりません。 とほほなどのサイトで調べましたがよくわかりませんでした。 何かお分かりの方がいましたら教えてください。 よろしくお願いします。 以下、内容 <title>表の内容をJavaScriptで自動生成する</title> <style type="text/css"> 省略 p { margin: 15px; } img { border-width: 0; } img.fl-lt { margin-right: 10px; margin-bottom: 10px; float: left; border: 1px solid #999; } a { font-weight: bold; } .price { font-size: 10pt; font-weight: bold; color: #c00; } .pc { font-size: 10pt; } .desc { font-size: 10pt; } </style> <script type="text/javascript"> <!-- iTblCnt = 6; iTbl = new Array( "A行の内容", "B行の内容", "C行の内容", "D行の内容", "E行の内容", "F行の内容" ); iTblColor = new Array("silver","white"); // --> </script> </head> <body> <table> <script type="text/javascript"> <!-- for(iCnt=0; iCnt<iTblCnt; iCnt++) { document.write( "<tr><td style='background:", iTblColor[iCnt%2], "'>", iTbl[iCnt], "</td></tr>" ); } // --> </script> </table> </body> </html>
- putitpmatp
- お礼率69% (431/618)
- CSS
- 回答数1
- ありがとう数2
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
スタイルを適用させるためのクラス名です。 <span class="price">XXXXX</span> と記述すると・・・ <span style="font-size: 10pt; font-weight: bold; color: #c00; ">XXXXX</span> と同じことになります。 まとめてスタイルを適用するときに使います。 自由に名前を付けることができます。 class="price" class="pc" class="desc" の記述がどこかにないですか？雑誌だから無いかもしれませんが（抜粋だったら）。
関連するQ&A
- Firefoxでのスタイルシートの記述について
Firefoxでのスタイルシートの記述について ４つの文字を配置するために (1) font-size:18px; font-weight:bold; color:#000000; margin:127px 72px 0px 40px; (2) font-size:18px; font-weight:bold; color:#000000; margin:64px 72px 0px 40px; (3) font-size:18px; font-weight:bold; color:#000000; margin:101px 72px 0px 40px; (4) font-size:18px; font-weight:bold; color:#000000; margin:65px 72px 0px 40px; と指定しました。IEでは思った位置になったのですが Firefoxでは(2)(3)(4)が下のほうにずれてしまいました。Firefoxに合わせるとIEでの位置が上にずれてしまい頭を悩ませています。 記述の間違いや、アドバイスなどあれば教えてください。 よろしくお願いします。
- ベストアンサー
- HTML
- CSS、おかしいですか？
CSSですが、本を見てやっています。 下記のように記述したのですが、書かなくてもよい記述とか、おかしいところ、ありますでしょうか？ <style type=text/css> body{font-size:10pt} td {font-size:10pt; line-height:12pt} tr {font-size:10pt line-height:12pt} dive {font-size:10pt;line-height:12pt} a:link {font-size:10pt; font-weight:normal; font-style:normal; text-decoration:underline; text-align:left; vertical-align:; color:#990000} a:visited {font-size:10pt; font-weight:normal; font-style:normal; text-decoration:underline; text-align:left; vertical-align:; color:#990000} a:active {font-size:10pt; font-weight:normal; font-style:normal; text-decoration:underline; text-align:left; vertical-align:; color:#ff0099} a:hover {font-size:10pt; font-weight:normal; font-style:normal; text-decoration:underline; text-align:left; vertical-align:; color:#ff0099} </style>
- 締切済み
- CSS
- 一部のパソコンでスタイルシートが読み込まない
こんにちわ 以下のスタイルシートを使っていますが一部のパソコンで読み込みにいかないような現象が起こっています。 相手のブラウザーはインターネットエクスプローラの６でOSはXPです。 サイトフォルダ内にCSSフォルダーを設けてその中のスタイルシートをいれています。 HTMLソース <LINK rel="stylesheet" href="css/body.css" type="text/css"> スタイルシート↓ h1 { font-size:12px; font-weight:100; margin:0px; padding:00px 0px 0px 00px; color:#FFFFFF; } h2 { font-size:12px; font-weight:100; margin:0px; padding:00px 0px 0px 00px; } h3 { font-size:12px; font-weight:100; margin:0px; padding:00px 0px 0px 00px; } h4 { font-size:12px; font-weight:100; margin:0px; padding:00px 0px 0px 00px; } STRONG { font-size:12px; font-weight:100; margin:0px; padding:00px 0px 0px 00px; } em {font-size:12px;line-height:12px;font-weight : normal;normal;margin:0px;} .t0 {font-size:10px;} .t0h12 {font-size:10px;line-height:12px;} .t0h14 {font-size:10px;line-height:14px;} .t0h16 {font-size:10px;line-height:16px;} .t1 {font-size:12px;} .t1h14 {font-size:12px;line-height:14px;} .t1h16 {font-size:12px;line-height:16px;} .t1h18 {font-size:12px;line-height:18px;} .t2 {font-size:14px;} .t2h16 {font-size:14px;line-height:16px;} .t2h18 {font-size:14px;line-height:18px;} .t2h20 {font-size:14px;line-height:20px;}
- ベストアンサー
- HTML
- cssがhtmlに反映しません
.style01 { font-size: 120%; color: red; font-weight: bold; } .style02 { color: blue; font-weight: bold; } .style03 { background-color:yellow; text-decoration: underline; } .style01.style02は反映しますが、 .style03 の{ background-color:yellow; text-decoration: underline; } background-color:yellow;の部分が全く反映しません。 なぜでしょう。
- ベストアンサー
- その他（インターネット・Webサービス）
- タイトルに太枠を付けるために
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <HTML> <HEAD> <style type="text/css"> <!-- .title { background-color:lightyellow; font-size:24px; font-weight:bold; margin-top:20px; margin-left:50px; margin-bottom:20px; margin-right:50px; border-color:blue; border-style:solid; border-width:5px; } --> </style> </HEAD> <BODY> <span class=title> 大石倉之助 </span> </BODY> </HTML> としたのですが 「大石倉之助」 に左右の太枠はつくのですが上下の太枠がつきません どうしたら上下にも太枠がつくのでしょうか？
- ベストアンサー
- HTML
- FireFox3.5.3でfont-familyが効きません
FireFox3.5.3で全くfont-familyが効かないのですが、 何か設定があるでしょうか。 使ったhtml --------------------------------------------------------------------------- <html> <head><title>書体テスト</title></head> <body> <div style="font-size:120%;padding:40px 10px 5px 10px;font-weight:bold;line-height:170%;font-family:'ＭＳ Ｐ明朝';"> フォントのテスト </div> <div style="font-size:120%;padding:40px 10px 5px 10px;font-weight:bold;line-height:170%;font-family:'ＭＳ 明朝';"> フォントのテスト </div> <div style="font-size:120%;padding:40px 10px 5px 10px;font-weight:bold;line-height:170%;font-family:serif;"> フォントのテスト </div> <div style="font-size:120%;padding:40px 10px 5px 10px;font-weight:bold;line-height:170%;"> フォントのテスト </div> </body> </html> --------------------------------------------------------------------------- 各種ブラウザで確認しましたが、FireFoxだけ全くfont-familyが効きません。テスト結果は添付のとおりです。 FireFoxの設定は、オプションのコンテンツ・フォントと配色は「メイリオ」で詳細設定は以下のとおり プロポーショナル：ゴシック 明朝体：MS P明朝 ゴシック体：メイリオ 等幅：メイリオ よろしく、お願いします。
- ベストアンサー
- HTML
- EXCELでHTMLのタグの入ったセルを結合したい
下記のHTMLのタグが入ったセルと画像URLのセルを結合したいのですが、＆などで結合すると ダブルクォーテーションが倍くらいに増えてHTMLのタグとして機能しません。 どうやって結合させるのがいいのでしょうか？ =A1(HTMLのタグ）＆A2(画像URL）＆A3（HTMLのタグ） <body> <div style="WIDTH: 100%; TEXT-ALIGN: center"> <div id="wrapper" style="FONT-SIZE: 23px; FONT-FAMILY: Arial, Helvetica, sans-serif; WIDTH: 860px; COLOR: #000; TEXT-ALIGN: left; MARGIN: 0px auto"> <h1 style="FONT-SIZE: 38px; HEIGHT: 60px; WIDTH: 850px; COLOR: #ffffff; PADDING-LEFT: 10px; MARGIN: 0px; LINE-HEIGHT: 60px; BACKGROUND-COLOR: #336600">Picture</h1> <img src="画像URL"> <div class="sub_tit" style="FONT-SIZE: 35px; HEIGHT: 40px; WIDTH: 850px; FONT-WEIGHT: bold; COLOR: #ffffff; PADDING-LEFT: 10px; LINE-HEIGHT: 40px; BACKGROUND-COLOR: #336600"> Description </div><br><font size="5">
- ベストアンサー
- HTML
- 文字コード指定
プログラミング素人です。よろしくお願い致します。 文字をタイプライターのように流すスクリプトで、日本語が文字化けをしてしまいます。 ================= FONT-FAMILY:"+"MS Sans Serif,arial,helvetica"+"; FONT-FAMILY:"+"verdana,arial,helvetica"+"; ================= の部分を指定しなおせばなんとかなると思うのですが、どう書きなおせばいいのか教えてください。 念のため、コードを貼り付けます。 ================= uagent = window.navigator.userAgent.toLowerCase();IEB=(uagent.indexOf('msie') != -1)?true:false;var scompat = document.compatMode;var inoout=false;var tmpv;tmpv=770-8-8-2*parseInt(1);var cvar=0,say=0,tpos=0,enson=0,hidsay=0,hidson=0;var psy = new Array();var lllllllllll = new Array();var llllll=null;var llllll2=null;var lllllll=0;var llllllll=0;divtextb ="<div id=\"d";divtev1=" onmouseover=\"ll(";divtev2=")\" onmouseout =\"lll(";divtev3=")\" ";divtev4="";divtexts = " style=\"position:absolute;visibility:hidden;width:"+tmpv+"px; COLOR:"+"#000000"+"; left:0px; top:0px; FONT-FAMILY:"+"MS Sans Serif,arial,helvetica"+"; FONT-SIZE:"+22+"pt; FONT-STYLE:"+"normal"+"; FONT-WEIGHT:"+"normal"+"; margin:0px; LINE-HEIGHT:"+44+"pt; text-align:"+"left"+";overflow-x:hidden;padding:0px; cursor:default;\">";ie6span= " style=\"position:relative; COLOR:"+"#333399"+"; width:"+tmpv+"px; FONT-FAMILY:"+"verdana,arial,helvetica"+"; FONT-SIZE:"+9+"pt; FONT-STYLE:"+"normal"+"; FONT-WEIGHT:"+"bold"+"; TEXT-DECORATION:"+"none"+"; LINE-HEIGHT:"+14+"pt; text-align:"+"left"+";padding:0px;\"";uzun="<div id=\"enuzun\" style=\"position:absolute;left:0px;top:0px;\">"; 以下、省略
- ベストアンサー
- JavaScript
- jQueryで特定のcssプロパティの値を書き換えたい
jQueryで特定のcssプロパティの値を書き換えたい html上にインラインで記述しているスタイルのうち、特定のプロパティの値のみをjQueryで書き換えることはできますでしょうか。 具体的には↓ <span style="font-size: 16px;font-weight: bold;">テキスト1</span> <span style="color: #f00; font-size: 16px;">テキスト2</span>を <span style="font-size: 18px;font-weight: bold;">テキスト1</span> <span style=""color: #f00; font-size: 18px;">テキスト2</span>に style属性のfont-size: 16px;をfont-size: 18px;にしたい。 他は変えずそのままにしたい。 $(function() { $('span').filter(function() { return ($(this).css("font-size","16px")); }).css("font-size","18px") }); http://okwave.jp/qa/q5310183.html 似たような質問が上記でされていて、真似て書いてみたのですが、これだとfont-sizeが16pxでないものも全て18pxに書き換わってしまいました。 不勉強でお恥ずかしい限りですが、詳しい方いらっしゃいましたらどうかご教授ください。 よろしくお願いいたします。
- ベストアンサー
- JavaScript
- テーブルタグについて
重ね重ね質問してごめんなさい！ スタイルシートを使ってみたんですけど・・・ <HTML> <HARD> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="content-style-type" content="text/css"> <META name="robots" content="noindex,nofollow"> <TITLE>**************</TITLE> <style type="text/css"><!-- body{font-size:12px;} div{font-size:14pt;font-weight:bold;color:orange;text-indent:47em;} .moji{font-size:13px;font-weight:normal;color:black;text-indent:65em;} span{font-size:14px;color:orange;margin-left:75em;} .rire{font-size:12px;color:black} --></style> </HEAD> <BODY> <BR><BR><BR><BR> <div>***********</div> <BR> <div class="moji">***************</div> <BR><BR> <span><A HREF="mail.htm"><IMG SRC="image/******.gif" border=0></A>(←mail)</span> <BR><BR><BR><BR> <table class="rire" border align="right" border="0" cellpadding="0" cellspacing="1" bordercolor="orange"> <tbody> <tr> <td>**** <img src="image/***.gif"></td> <BR> <tr> <td align="left"> <table style=" border:1px;solid #ffa000; cellpadding: 3px;width: 320px;height: 63px ;color:black; font-size:12px;"> <tr> <td>****</td> </tr> </tbody> </table> ・ ・ ・ テーブルタグを閉じても文字がテーブルの中に入ってしまうんです・・・。 何が間違っているのか分かりません・・・。閉じるタブは閉じてます・・・よね？ 教えてください！
- ベストアンサー
- HTML
お礼
返信ありがとうございます。お蔭様でよく理解することができました。