ホームページ > 記事 > ウェブフロントエンド > CSSの書き方とdocumentsの検索の詳細_html/css_WEB-ITnose
CSSの書き方とdocumentsの検索の詳細_html/css_WEB-ITnose
- WBOYオリジナル
- 2016-06-24 11:23:07915ブラウズ
これはCSSでフォント属性を制御する際に犯したミスです。不注意とも言えます。
質問の要件は写真の通りです:
この質問は非常に簡単ですが、私個人としては間違っていました。最初に以前の間違った HTML コードと正しい CSS を入力しました
間違った 1.html
<html><head><title>font</title><link rel="stylesheet" type="text/css" href="one.css"> <!--对css的引用这是外联css--></head><body><span class="s1">梁山英雄排行榜</span><br/><br/> <!--"<span></span>是行元素，而<p></p>是块元素"--><span class="s2">宋江</span><br/><br/> <!--class定义css的类别--><span class="s3">卢员外</span><br/><br/><span class="s4">吴用</p><br/><br/> <!--请注意</p>接下来就是我要讲的,错也错在</p>这--><span class="s3">豹子头</p><br/><br/><span class="s3">大刀关胜</span><br/><br/></body></html>正しい one.css
.s1{ color:gold; font-size:30px;}.s2{ color:red; background-color:silver; font-style:italic;}.s3{ background-color:silver; }.s4{ background-color:silver; /*silver为银灰色*/ font-decoration:underline; /*decoration为修饰，underline为下划线*/ font-style:italic; /*字体样式为斜体*/} 結果は、写真に示すように実際のものと非常によく似ています:
非常に不満です良いアイデア: まず、94b3e26ee717c64999d7867364b1b4a3 に気づきましたが、それを脇に置いて、CSS を書き終えたときに、html の 94b3e26ee717c64999d7867364b1b4a3 タグを変更するのを忘れていました。 。
結果: 段落間に大きなギャップがあることがわかり、すべての段落に下線が引かれていましたが、コードをざっと見ただけでは見つかりませんでした。94b3e26ee717c64999d7867364b1b4a3 それが優先事項なのかと疑問に思いました。 、話が逸れてしまい、CSSを変更しました。Baiduに付属のクラス名でも良い結果が得られませんでした。その間。
後: HTML コードを読み直して 94b3e26ee717c64999d7867364b1b4a3 の問題を見つけたのでまとめてみました
<html><head><title>font</title><link rel="stylesheet" type="text/css" href="one.css"> </head><body><span class="s1">梁山英雄排行榜</span><br/><br/> <span class="s2">宋江</span><br/><br/><span class="s3">卢员外</span><br/><br/><span class="s4">吴用</span><br/><br/> <span class="s3">豹子头</span><br/><br/><span class="s3">大刀关胜</span><br/><br/></body></html>結果は写真に示すように正常です:
Iこの写真を投稿しました ここで、見やすくするために、もう 1 つの演習 2 があります。 正しい HTML コードと不足している CSS を一緒に書きます
2.html
<html><head><title>链接</title><style="text/css"> <!--内联css，不过css的注释是"/**/"-->a{ color:red; font-size:24px; font-decoration:none;}a:hover{ <!--hover为伪类定义鼠标悬停的--> font-decoration:underline; font-size:40px; color:green;}<head><body><a href="#">连接到百度<a></body></html> コードのどこが不足しているのか、不足しているコードは何かを考えてください？ Baidu やドキュメントを使用しないことをお勧めします。最初に私の経験と考えを共有します。私は、Baidu で「CSS でフォントの属性を定義できる」というエントリを読み落としました。 . ですが、なぜ Baidu が CSS ドキュメントマニュアルに何かを記載しているのか考えてみました。これにより、非常にプロフェッショナルに見えなくなります。 完全な補足:
<html><head><title>链接</title><style="text/css"> a{ color:red; font-size:24px; font-family:"华文新魏"; font-decoration:none;}a:hover{ font-decoration:underline; font-size:40px; color:green; font-famliy:"宋体";}a:visited{color:gray;}<head><body><a href="#">连接到百度</a></body></html> 写真に示すように:
注: この HTML リンクを再度開くときは、ブラウザのキャッシュを忘れずにクリアしてください。そうしないと、効果は Baidu への灰色の接続と同じになり、リフレッシュすると役に立たないこと。
追記:
個人的には、Baidu は最良の答えですが、最悪の答えでもあります。Baidu ではほとんど入手できない最新テクノロジーを盲目的に求めているだけです。しかし彼は全能です。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。