Rumah >hujung hadapan web >html tutorial >Pengenalan penggunaan kecil kedudukan dalam pengeluaran halaman html_HTML/Xhtml_Web

Pengenalan penggunaan kecil kedudukan dalam pengeluaran halaman html_HTML/Xhtml_Web

WBOY
WBOYasal
2016-05-16 16:38:551418semak imbas

Saya baru sahaja mempelajari beberapa kandungan HTML semalam, dan saya tidak sabar untuk membuat bar carian di JD.com akhirnya saya berjaya, tetapi semasa saya membuat pembayaran troli beli-belah, terdapat nombor yang dipaparkan padanya dan saya telah melakukannya. t tahu bagaimana untuk menambahnya, jika anda mahu nombor untuk bergerak dengan troli beli-belah, anda mesti meletakkan mereka bersama-sama pasti memerlukan kedudukan Pertama, tetapkan kedudukan div nombor kepada mutlak, yang memberikannya berlapis rasa, kerana pada masa ini Tag induk kedudukan digital adalah badan, jadi apabila menetapkan atas dan kiri, anda juga boleh menetapkannya ke kedudukan troli beli-belah yang diingini Walau bagaimanapun, jika anda menukar margin troli beli-belah, yang dua tidak boleh bergerak bersama, jadi anda menetapkan kedudukan troli beli-belah Menjadi relatif, supaya tag induk kedudukan nombor menjadi troli beli-belah Tidak kira bagaimana margin troli beli-belah dilaraskan, nombor akan bergerak dengannya....

Salin kod
Kodnya adalah seperti berikut:



day03.html< <br /><style type="text/css"> untuk kedudukan*/ <br>#kereta{ <br>lebar:150px;tinggi:30px; <br>latar belakang: #999999; <br>warna:putih;sejajarkan teks: <br>tinggi garisan: 30px ;margin: 232px 300px; <br>sempadan:1px hitam pejal;kedudukan: relatif; <br>} <br>#num{ <br>lebar:20px;tinggi:20px;latar belakang: merah; ;text-aligh:center; <br>ketinggian baris:20px;kedudukan: mutlak <br> atas:-15px;kiri: 25px; kepala> <br><badan> <br><div id="kereta"> 🎜></div> <br></body></html><br><br><br> </div></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="Cara melaksanakan pemisah baris dalam kawasan input teks textarea_HTML/Xhtml_Pengeluaran halaman web" href="https://m.php.cn/ms/faq/11405.html">Cara melaksanakan pemisah baris dalam kawasan input teks textarea_HTML/Xhtml_Pengeluaran halaman web</a></span><span>Artikel seterusnya:<a class="dBlack" title="Cara melaksanakan pemisah baris dalam kawasan input teks textarea_HTML/Xhtml_Pengeluaran halaman web" href="https://m.php.cn/ms/faq/11409.html">Cara melaksanakan pemisah baris dalam kawasan input teks textarea_HTML/Xhtml_Pengeluaran halaman web</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>Artikel berkaitan</h2><em><a href="https://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="https://m.php.cn/ms/faq/348757.html" title="Html小知识总结" class="aBlack">Html小知识总结</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/ms/faq/348804.html" title="如何快速学习HTML" class="aBlack">如何快速学习HTML</a><div class="clear"></div></li><li><b></b><a href="https://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="https://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="https://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><footer><div class="footer"><div class="footertop"><img src="/static/imghwm/logo.png" alt=""><p>Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!</p></div><div class="footermid"><a href="https://m.php.cn/ms/about/us.html">Tentang kita</a><a href="https://m.php.cn/ms/about/disclaimer.html">Penafian</a><a href="https://m.php.cn/ms/update/article_0_1.html">Sitemap</a></div><div class="footerbottom"><p> © php.cn All rights reserved </p></div></div></footer><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><!-- Matomo --><script> var _paq = window._paq = window._paq || []; /* tracker methods like "setCustomDimension" should be called before "trackPageView" */ _paq.push(['trackPageView']); _paq.push(['enableLinkTracking']); (function() { var u="https://tongji.php.cn/"; _paq.push(['setTrackerUrl', u+'matomo.php']); _paq.push(['setSiteId', '9']); var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s); })(); </script><!-- End Matomo Code --></html>