忍者ブログ
日々の研究生活のメモ書きなど

最近、htmlのことをいろいろと勉強している(君、物理屋だよね?)

htmlのコードの中で
divを使ってグループ化をする=> CSSでグループに属性をつける
という流れが多い

本によってはidとclassの属性どちらを付けるかが割と割れてる

↓にそのまま書かれてた
■ 参考 : CSSの記述方法 -idとclassの違い





id : 1ページで1回しか使えない
使い所はcontent, container, footer, sidebarとか明らかに1つのページに1つしかないものに使うべきか

class : 1ページ内で何度も使える
「1ページで1度しか使用できない名前を複数使ってしまった場合(id="name"という記述が複数になった場合)、一部のアクセス解析やその他 cgiプログラムなどで不具合を起こしてしまうこともあるようです。ブラウザ上ではid名が重複していてもCSSの指定は反映されますが、リスクを考えて慎重に使うようにしましょう。」とのこと


この違いを知ると、idを使う利点がほぼないように感じるが・・・・




ちなみにidの設定をするときCSSでは
#hoge_id {foo : AAA; }
と#から始める

classの設定をする時CSSでは
.hoge_clas {bar : BBB;}
のように.から始める





あと本によって見かけたのは
div#hoge_id {foo : AAA;}
と頭にdivがついている設定方法

これについては↓に詳しく書かれていた
■ 参考 : CSS divのidとclass、#と.って。初歩の確認事項

#hoge_id {foo : AAA; }
.hoge_clas {bar : BBB;}
という書き方は
*#hoge_id {foo : AAA; }
*.hoge_clas {bar : BBB;}
のようにアスタリスクを省略した書き方
div#hoge_id {foo : AAA;}
はきちんと特定の要素にのみこの設定させると書いているらしい



基本的に.で設定するclassのみを使っていこうと思う








PR
この記事にコメントする
Name
Title
Color
E-Mail
URL
Comment
Password   Vodafone絵文字 i-mode絵文字 Ezweb絵文字
プロフィール
HN:coffee
職業:物理屋(自称)
趣味:映画鑑賞、登山
出身:大阪府の南の田舎
自己紹介:
import MyProfile
import coffee_pote from TWITTER
import amazonのほしい物リスト from WISH_LIST

print "生きてます"
print "コロナのせいで15万くらい損失出してますが、生きてます"

# 最終更新 2020/03/15
カウンター
カウンター カウンター
ブログ内検索
ツイートするボタン
リンク
相互リンク募集中です (Twitterにてお知らせください)

Demo scripts for gnuplot version 5
(gnuplotのさまざまなデモ画像と作り方がまとめられている、眺めているだけでできるようになった気分になれる)

gnuplotスクリプトの解説
(米澤進吾さんの個人ページ、gnuplotと言えばこのかた)

gnuplot のページ
(Takeno Lab、うちのブログがリンクされていたのでリンク返し)

とある物理の院生日誌~院生は社会へ旅立った~
(研究室の先輩の個人ブログ)

英語例文を見て自然に英語・英会話を学ぶ
(楠本慶ニさんの個人ページ、様々な情報の密度の高さに感動)

Twitterから映画の評価が分かる & 映画の鑑賞記録が残せる coco
(映画の感想をまとめられるサイト、いつもお世話になっています)

Astronomy Picture of the Day Archive
(天文や宇宙関連の最新の話題について画像とともにNASAが説明しているページ)

今日のほしぞら
(任意の時刻の空で見える星を表示してくれる、国立天文台が管理している)

GNUPLOTとアニメーション
(応用の項目の「見せてあげよう!ラピュタの雷を!!」あたりからすごすぎる)

読書メーター
(読んだ本をリストできる便利なサイト)

flickr難民の写真置き場
(20XX年、flickrは有料化の炎に包まれた。あらゆるflickr無料ユーザーは絶滅したかに見えた。 しかし、tumblr移住民は死に絶えてはいなかった。)

教授でもできるMac OS X へのLaTeX, X11, gccのインストレーションと環境設定
(阪大の山中卓さんのwebページ、タイトルにセンスが溢れている、内容は超充実してる、特にTeX関連、学振DCとかPDの申請書類作成時にはお世話になっております)

英語論文執筆用の例文検索サービス
(とんでもないものを見つけてしまった・・・・ arXivに収録されている 811,761報の 英語論文から,例文を検索するための検索エンジン)


Template "simple02" by Emile*Emilie
忍者ブログ [PR]