`
o_o_0
  • 浏览: 16095 次
  • 性别: Icon_minigender_1
  • 来自: 济南
文章分类
社区版块
存档分类
最新评论

Html block and inline

 
阅读更多

HTML elements can be grouped together with <div> and <span>


HTML Block Elements

Most HTML elements are defined asblock levelelements or asinlineelements.

Block level elements normally start (and end) with a new line when displayed in a browser.

Examples: <h1>, <p>, <ul>, <table>


HTML Inline Elements

Inline elements are normally displayed without starting a new line.

Examples: <b>, <td>, <a>, <img>


The HTML <div> Element

The HTML <div> element is a block level element that can be used as a container for grouping other HTML elements.

The <div> element has no special meaning. Except that, because it is a block level element, the browser will display a line break before and after it.

When used together with CSS, the <div> element can be used to set style attributes to large blocks of content.

Another common use of the <div> element, is for document layout. It replaces the "old way" of defining layout using tables. Using tables is not the correct use of the <table> element. The purpose of the <table> element is to display tabular data.


The HTML <span> Element

The HTML <span> element is an inline element that can be used as a container for text.

The <span> element has no special meaning.

When used together with CSS, the <span> element can be used to set style attributes to parts of the text.

分享到:
评论

相关推荐

    Exercise-HTML-Block-and-Inline-Elements

    完整的测试代码练习可以在这里找到:

    UE(官方下载)

    Incremental search is an inline, progressive search that allows you to find matched text as you type, much like Firefox's search feature Regular expressions Regular Expressions are essentially ...

    HTML 网页设计

    nav.horizontal ul li{ display: inline-block;}/* horizontal menu */ img{max-width:100%;} /*end reset*/ body, html { font-size: 100%; height: 100%; } body { font-family:Arial, Helvetica, sans-...

    Java邮件开发Fundamentals of the JavaMail API

    * Work with HTML messages * Use search terms to search for messages Prerequisites Instructions on how to download and install the JavaMail API are contained in the course. In addition, you will ...

    雅虎TAB效果代码 Javascript实现

    display:inline; width:125px; height:53px; margin:0 4px;} #tabs ul li a.outer {display:block; width:125px; height:49px; border-bottom:1px solid #9c9c9c; text-align:center; line-height:45px; text-...

    AQuery:反jQuery

    AQuery-AntiJQuery 对于那些想使用标准HTML DOM API进行编程但又想使其更快的人。 目的 尽管JQuery有时很有用,但是如果您喜欢... css ( 'display' , 'inline-block' ) ; // However, for AQuery, you can do this to

    当当网模板非常好用详细

    DISPLAY: inline-block; PADDING-LEFT: 18px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px } .public_footer .footer_copyright { PADDING-LEFT: 168px; MARGIN: 0px auto; WIDTH: 792px } .public_footer .footer_...

    eclipse-testng 离线包下载

    displayElement.style["display"] = "block"; } else { displayElement.style["display"] = "none"; } } function toggleDetailsVisibility(elementId) { var displayElement = document....

    出现问题a is defined高手帮忙

    DragZoomUtil.style([G.outlineDiv], {left: G.startX + addX + 'px', top: G.startY + addY + 'px', display: 'block', width: '1px', height: '1px'}); G.outlineDiv.style.width = rect.width + "px"; G....

    jquery需要的所有js文件

    a(b).parents().andSelf().filter(function(){return a.curCSS(this,"visibility")==="hidden"||a.expr.filters.hidden(this)}).length}function c(b,c){var e=b.nodeName.toLowerCase();if("area"===e){var f=b....

Global site tag (gtag.js) - Google Analytics