首页 养生问答 疾病百科 养生资讯 女性养生 男性养生
您的当前位置:首页正文

【前段开发】行内元素和块级元素总结(HTMLCSS)_html/css_WEB-ITnose

2020-11-27 来源:华佗健康网
块级元素


information on author
long quotation
push button
table caption
definition description
deleted text
generic language/style container
definition list
definition term
form control group
interactive form

heading

heading

heading

heading
heading
heading

horizontal rule
inline subwindow
inserted text
fieldset legend
  • list item
    client-side image map
    </td> <td>alternate content container for non frame-based rendering</td> </tr> <tr> <td><noscript></td> <td>alternate content container for non script-based rendering</td> </tr> <tr> <td><object></td> <td>generic embedded object</td> </tr> <tr> <td><ol></td> <td>ordered list</td> </tr> <tr> <td><p></td> <td>paragraph</td> </tr> <tr> <td><pre class="brush:php;toolbar:false"></td> <td>preformatted text</td> </tr> <tr> <td><table></td> <td>table</td> </tr> <tr> <td><tbody></td> <td>table body</td> </tr> <tr> <td><td></td> <td>table data cell</td> </tr> <tr> <td><tfoot></td> <td>table footer</td> </tr> <tr> <td><th></td> <td>table header cell</td> </tr> <tr> <td><thead></td> <td>table header</td> </tr> <tr> <td><tr></td> <td>table row</td> </tr> <tr> <td></td> <td>unordered list</td> </tr> </table> <br /> <p>行内元素<br /> </p> <table> <tr> <td></td> <td>anchor</td> </tr> <tr> <td></td> <td>abbreviated form</td> </tr> <tr> <td></td> <td>acronym</td> </tr> <tr> <td><b></td> <td>bold text style</td> </tr> <tr> <td><bdo></td> <td>I18N BiDi over-ride</td> </tr> <tr> <td><big></td> <td>large text style</td> </tr> <tr> <td><br></td> <td>forced line break</td> </tr> <tr> <td><button></td> <td>push button</td> </tr> <tr> <td><cite></td> <td>citation</td> </tr> <tr> <td><code></td> <td>computer code fragment</td> </tr> <tr> <td><del></td> <td>deleted text</td> </tr> <tr> <td><dfn></td> <td>instance definition</td> </tr> <tr> <td><em></td> <td>emphasis</td> </tr> <tr> <td><i></td> <td>italic text style</td> </tr> <tr> <td></td> <td>inline subwindow</td> </tr> <tr> <td><img></td> <td>Embedded image</td> </tr> <tr> <td><input></td> <td>form control</td> </tr> <tr> <td><ins></td> <td>inserted text</td> </tr> <tr> <td><kbd></td> <td>text to be entered by the user</td> </tr> <tr> <td><label></td> <td>form field label text</td> </tr> <tr> <td><map></td> <td>client-side image map</td> </tr> <tr> <td><object></td> <td>generic embedded object</td> </tr> <tr> <td><q></td> <td>short inline quotation</td> </tr> <tr> <td><samp></td> <td>sample program output, scripts, etc.</td> </tr> <tr> <td><select></td> <td>option selector</td> </tr> <tr> <td><small></td> <td>small text style</td> </tr> <tr> <td></td> <td>generic language/style container</td> </tr> <tr> <td></td> <td>strong emphasis</td> </tr> <tr> <td><sub></td> <td>subscript</td> </tr> <tr> <td><sup></td> <td>superscript</td> </tr> <tr> <td><textarea></td> <td>multi-line text field</td> </tr> <tr> <td><tt></td> <td>teletype or monospaced text style</td> </tr> <tr> <td><var></td> <td>instance of a variable or program argument</td> </tr> </table> <br /> <p>行内元素、非置换元素不会应用width属性,比如对行内元素应用了width:200px,你不会看到任何效果出现。<br /> </p> <p>行内元素、非置换元素不会应用height属性,但是高度可以通过line-height来指定。<br /> </p> <p>行内元素你可以给它设置padding,但只有padding-left和padding-right会有效果,没有padding-top和padding-bottom。<br /> </p> <p>margin属性也是和padding属性一样,对行内元素左右有效,上下无效。 </mip-showmore> <script type="text/javascript" src="https://jss.huatuo6.com/mobile/detail_dy.js"></script> <script type="text/javascript" src="https://jss.huatuo0.com/mobile/detail_left.js"></script> <script type="text/javascript" src="https://jss.huatuo0.com/mobile/detail_gg2.js"></script> </div><div on="click:showmore01.toggle" data-closetext="收起全文" class="mip-showmore-btn">显示全文</div> </div> <script type="text/javascript" src="https://jss.huatuo0.com/mobile/detail_foot.js"></script> <script type="text/javascript" src="https://jss.huatuo0.com/mobile/share_cebian_gg1.js"></script> <script type="text/javascript" src="https://jss.huatuo6.com/mobile/share_cebian_xgyd.js"></script> <script type="text/javascript" src="https://jss.huatuo0.com/mobile/share_cebian_gg2.js"></script> <script type="text/javascript" src="https://jss.huatuo6.com/mobile/share_cebian_rmtj.js"></script> <footer class="footer"> <p>Copyright © 2019-<span class="currentYear"></span> huatuo0.com 版权所有 <br> <a style="color:#fff" href="https://beian.miit.gov.cn/" target="_blank">湘ICP备2023021991号-1</a></p> </footer> <script> var swiper = new Swiper('.ss .swiper-container', { pagination: '.ss .swiper-pagination', slidesPerView: 3, slidesPerColumn: 2, paginationClickable: true, spaceBetween: 30 }); </script> <script> var swiper = new Swiper('.tech_banner .swiper-container', { pagination: '.tech_banner .swiper-pagination', paginationClickable: true, spaceBetween: 30, centeredSlides: true, autoplay: 2500, autoplayDisableOnInteraction: false, loop: true, }); </script> <script> var swiper = new Swiper('.indextop_hot_t .swiper-container', { pagination: '.indextop_hot_t .swiper-pagination', direction: 'vertical', slidesPerView: 1, paginationClickable: true, spaceBetween: 30, mousewheelControl: true, autoplay : 2000, loop: true, }); </script> <script> var swiper = new Swiper('.scroll_pic .swiper-container', { pagination: '.travel_guide .swiper-pagination', slidesPerView: 'auto', paginationClickable: true, centeredSlides: false, spaceBetween: 0, freeMode: true, }); </script> <!--弹窗开始--> <script type="text/javascript"> $(function() { //弹窗2 $('.menu_icon').click(function() { $('.tbox').show(); }) //关闭 $('.closebtn').click(function() { $('.tbox').hide(); }) }) </script> <!--弹窗结束--> <script type="text/javascript" src="https://jss.huatuo0.com/mobile/foot_foot.js"></script> <script type="text/javascript"> const currentYear = new Date().getFullYear(); $('.currentYear').html(currentYear) </script> <script type="text/javascript" src="https://jss.huatuo6.com/pc/tj_foot.js"></script> </body> </html>