Dalam HTML, kaedah utama untuk memperkenalkan CSS adalah sebaris, terbenam, diimport dan pautan
Sebaris: adalah untuk menetapkan gaya CSS dalam atribut gaya tanda. Kaedah ini pada asasnya Kelebihan CSS tidak ditunjukkan di atas, jadi penggunaan
tidak disyorkan Contoh:
Tunjuk Cara Teks
Ini ialah baris Teks.
Dibenamkan: Dibenamkan ialah untuk menulis tetapan untuk pelbagai elemen dalam halaman antara dan untuk satu halaman web, kaedah ini sangat mudah. Tetapi untuk tapak web yang mengandungi banyak halaman, jika setiap halaman menetapkan gaya sebaris sendiri, ia akan kehilangan kelebihan besar yang dibawa oleh CSS Oleh itu, laman web biasanya menulis fail helaian gaya CSS bebas, menggunakan dua berikut Salah satu cara ini. diperkenalkan ke dalam dokumen HTML.
Contoh:
< ;html>
Teks Demo< ;/title> ;<br><style type="text/css"><br>h1{<br> color:white;<br> background-color:boue;<br> }<br></ gaya><br> </head><br> <badan><br><h1>Ini ialah baris Teks.</h1><br><h1>Ini adalah satu lagi baris Teks. </ h1><br> </body><br> </html><br>
</div>
<br><strong>Import dan pautan: </strong>Tujuan import dan pautan adalah untuk menukar Fail CSS bebas memperkenalkan fail HTML, dan terdapat perbezaan yang sepadan antara kedua-duanya. <br>Malah, perbezaan terbesar antara kedua-duanya ialah jenis pautan menggunakan teg HTML untuk memperkenalkan fail CSS luaran, manakala jenis import menggunakan peraturan CSS untuk memperkenalkan fail CSS luaran. Oleh itu sintaks mereka juga berbeza. <br>Jika anda menggunakan gaya pautan, anda perlu menggunakan pernyataan berikut untuk memperkenalkan fail CSS luaran. <br><link href="mystyle.css" rel="stylesheet" type="text/css" /><br>Jika anda menggunakan import, anda perlu menggunakan pernyataan berikut. <br><br><div class="msgheader">
<div class="right"><span style="CURSOR: pointer" onclick="copycode(getid('phpcode61'));"><u>Salin kod</u></span></div>Kodnya adalah seperti berikut:</div>
<div class="msgborder" id="phpcode61">
<br><style type=" text/css "><br> @import"mystyle.css";<br></style><br>
</div>
<br>Selain itu, kesan paparan kedua-dua kaedah ini juga sedikit berbeza. Apabila menggunakan kaedah pautan, fail CSS akan dimuatkan sebelum bahagian utama halaman pemasangan, supaya halaman web yang dipaparkan akan mempunyai kesan gaya dari awal Apabila menggunakan kaedah import, fail CSS akan dimuatkan selepas keseluruhan halaman dimuatkan. Untuk sesetengah penyemak imbas, dalam beberapa kes, jika saiz fail halaman web agak besar, halaman yang tidak digayakan akan dipaparkan dahulu, dan kemudian kesan set gaya akan muncul selepas kilat. Dari perspektif penonton, ini adalah kelemahan menggunakan import. Untuk beberapa tapak web yang agak besar, untuk memudahkan penyelenggaraan, anda mungkin mahu meletakkan semua gaya CSS ke dalam beberapa fail CSS Dengan cara ini, jika anda menggunakan import pautan, anda memerlukan beberapa pernyataan untuk mengimport fail CSS secara berasingan. Jika anda ingin melaraskan klasifikasi fail CSS, anda perlu melaraskan fail HTML pada masa yang sama. Ini adalah kelemahan untuk kerja penyelenggaraan. Jika anda menggunakan kaedah import, anda hanya boleh mengimport fail CSS umum dan kemudian mengimport fail CSS bebas lain dalam fail ini, kaedah pautan tidak mempunyai ciri ini. <br><br>Jadi cadangan di sini ialah jika anda perlu memperkenalkan fail CSS, gunakan kaedah pautan jika anda perlu memperkenalkan berbilang fail CSS, mula-mula gunakan kaedah pautan untuk memperkenalkan fail CSS "direktori", ini Fail CSS " Direktori" dan kemudian gunakan import untuk memperkenalkan fail CSS lain. <br>Jika anda ingin membuat keputusan secara dinamik fail CSS yang hendak diimport melalui JavaScript, anda mesti menggunakan pemautan untuk mencapai ini.</div><div class="nphpQianMsg"><div class="clear"></div></div><div class="nphpQianSheng"><span>Kenyataan：</span><div>Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn</div></div></div><div class="nphpSytBox"><span>Artikel sebelumnya：<a class="dBlack" title="JavaScript dalam html pilih semua/nyahpilih semua operasi contoh kod_HTML/Xhtml_pengeluaran halaman web" href="http://m.php.cn/ms/faq/11508.html">JavaScript dalam html pilih semua/nyahpilih semua operasi contoh kod_HTML/Xhtml_pengeluaran halaman web</a></span><span>Artikel seterusnya：<a class="dBlack" title="JavaScript dalam html pilih semua/nyahpilih semua operasi contoh kod_HTML/Xhtml_pengeluaran halaman web" href="http://m.php.cn/ms/faq/11510.html">JavaScript dalam html pilih semua/nyahpilih semua operasi contoh kod_HTML/Xhtml_pengeluaran halaman web</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>Artikel berkaitan</h2><em><a href="http://m.php.cn/ms/article.html" class="bBlack"><i>Lihat lagi</i><b></b></a></em><div class="clear"></div></div><ins class="adsbygoogle"
style="display:block"
data-ad-format="fluid"
data-ad-layout-key="-6t+ed+2i-1n-4w"
data-ad-client="ca-pub-5902227090019525"
data-ad-slot="8966999616"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({});
</script><ul class="nphpXgwzList"><li><b></b><a href="http://m.php.cn/ms/faq/348757.html" title="Html小知识总结" class="aBlack">Html小知识总结</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ms/faq/348804.html" title="如何快速学习HTML" class="aBlack">如何快速学习HTML</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ms/faq/348873.html" title="html xhtml xml的区别" class="aBlack">html xhtml xml的区别</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ms/faq/348884.html" title="src与href属性的区别" class="aBlack">src与href属性的区别</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ms/faq/348902.html" title="关于HTML5和CSS替换使用" class="aBlack">关于HTML5和CSS替换使用</a><div class="clear"></div></li></ul></div></div><ins class="adsbygoogle"
style="display:block"
data-ad-format="autorelaxed"
data-ad-client="ca-pub-5902227090019525"
data-ad-slot="5027754603"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({});
</script><div class="nphpFoot"><div class="nphpFootBg"><ul class="nphpFootMenu"><li><a href="http://m.php.cn/ms/"><b class="icon1"></b><p>Rumah</p></a></li><li><a href="http://m.php.cn/ms/course.html"><b class="icon2"></b><p>Kursus</p></a></li><li><a href="http://m.php.cn/ms/wenda.html"><b class="icon4"></b><p>Soal Jawab</p></a></li><li><a href="http://m.php.cn/ms/login"><b class="icon5"></b><p>saya</p></a></li><div class="clear"></div></ul></div></div><div class="nphpYouBox" style="display: none;"><div class="nphpYouBg"><div class="nphpYouTitle"><span onclick="$('.nphpYouBox').hide()"></span><a href="http://m.php.cn/ms/"></a><div class="clear"></div></div><ul class="nphpYouList"><li><a href="http://m.php.cn/ms/"><b class="icon1"></b><span>Rumah</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ms/course.html"><b class="icon2"></b><span>Kursus</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ms/article.html"><b class="icon3"></b><span>Artikel</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ms/wenda.html"><b class="icon4"></b><span>Soal Jawab</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ms/dic.html"><b class="icon6"></b><span>Kamus</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ms/course/type/99.html"><b class="icon7"></b><span>Manual</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ms/xiazai/"><b class="icon8"></b><span>Muat turun</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ms/faq/zt" title="Topik"><b class="icon12"></b><span>Topik</span><div class="clear"></div></a></li><div class="clear"></div></ul></div></div><div class="nphpDing" style="display: none;"><div class="nphpDinglogo"><a href="http://m.php.cn/ms/"></a></div><div class="nphpNavIn1"><div class="swiper-container nphpNavSwiper1"><div class="swiper-wrapper"><div class="swiper-slide"><a href="http://m.php.cn/ms/" >Rumah</a></div><div class="swiper-slide"><a href="http://m.php.cn/ms/article.html" class="hover">Artikel</a></div><div class="swiper-slide"><a href="http://m.php.cn/ms/wenda.html" >Soal Jawab</a></div><div class="swiper-slide"><a href="http://m.php.cn/ms/course.html" >Kursus</a></div><div class="swiper-slide"><a href="http://m.php.cn/ms/faq/zt" >Topik</a></div><div class="swiper-slide"><a href="http://m.php.cn/ms/xiazai" >Muat turun</a></div><div class="swiper-slide"><a href="http://m.php.cn/ms/game" >Permainan</a></div><div class="swiper-slide"><a href="http://m.php.cn/ms/dic.html" >Kamus</a></div><div class="clear"></div></div></div><div class="langadivs" ><a href="javascript:;" class="bg4 bglanguage"></a><div class="langadiv" ><a onclick="javascript:setlang('zh-cn');" class="language course-right-orders chooselan " href="javascript:;"><span>简体中文</span><span>（ZH-CN）</span></a><a onclick="javascript:setlang('en');" class="language course-right-orders chooselan " href="javascript:;"><span>English</span><span>（EN）</span></a><a onclick="javascript:setlang('zh-tw');" class="language course-right-orders chooselan " href="javascript:;"><span>繁体中文</span><span>（ZH-TW）</span></a><a onclick="javascript:setlang('ja');" class="language course-right-orders chooselan " href="javascript:;"><span>日本語</span><span>（JA）</span></a><a onclick="javascript:setlang('ko');" class="language course-right-orders chooselan " href="javascript:;"><span>한국어</span><span>（KO）</span></a><a onclick="javascript:;" class="language course-right-orders chooselan chooselanguage" href="javascript:;"><span>Melayu</span><span>（MS）</span></a><a onclick="javascript:setlang('fr');" class="language course-right-orders chooselan " href="javascript:;"><span>Français</span><span>（FR）</span></a><a onclick="javascript:setlang('de');" class="language course-right-orders chooselan " href="javascript:;"><span>Deutsch</span><span>（DE）</span></a></div></div><script> var swiper = new Swiper('.nphpNavSwiper1', {
slidesPerView : 'auto',
observer: true,//修改swiper自己或子元素时，自动初始化swiper
observeParents: true,//修改swiper的父元素时，自动初始化swiper
});
</script></div></div><!--顶部导航 end--><script>isLogin = 0;</script><script type="text/javascript" src="/static/layui/layui.js"></script><script type="text/javascript" src="/static/js/global.js?4.9.47"></script></div><script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script><link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css' type='text/css' media='all'/><script type='text/javascript' src='/static/js/viewer.min.js?1'></script><script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script><script>jQuery.fn.wait = function (func, times, interval) {
var _times = times || -1, //100次
_interval = interval || 20, //20毫秒每次
_self = this,
_selector = this.selector, //选择器
_iIntervalID; //定时器id
if( this.length ){ //如果已经获取到了，就直接执行函数
func && func.call(this);
} else {
_iIntervalID = setInterval(function() {
if(!_times) { //是0就退出
clearInterval(_iIntervalID);
}
_times <= 0 || _times--; //如果是正数就 --
_self = $(_selector); //再次选择
if( _self.length ) { //判断是否取到
func && func.call(_self);
clearInterval(_iIntervalID);
}
}, _interval);
}
return this;
}
$("table.syntaxhighlighter").wait(function() {
$('table.syntaxhighlighter').append("<p class='cnblogs_code_footer'><span class='cnblogs_code_footer_icon'></span></p>");
});
$(document).on("click", ".cnblogs_code_footer",function(){
$(this).parents('table.syntaxhighlighter').css('display','inline-table');$(this).hide();
});
$('.nphpQianCont').viewer({navbar:true,title:false,toolbar:false,movable:false,viewed:function(){$('img').click(function(){$('.viewer-close').trigger('click');});}});
</script></body></html>