HTML 块元素
大多数HTML元素被定义 为块级元素或内联元素。
块级元素在浏览器中显示时，通常会以新行来开始（和结束）。
例子：<h1>,<p>,<ul>,<table>
HTML 内联元素
内联元素在显示时通常不会以新行开始。
例子：<b>,<td>,<a>,<img>
HTML <div>元素
HTML <div>元素是块级元素，它是可用于组合其他的HTML元素的容器。
<div>元素没有特定的含义。除此之外，由于它属于块级元素，浏览器会在其前后显示折行。
如果与CSS一同使用，<div>元素可用于对大的内容设置样式属性。
<div>元素的另一个常见用途是文档布局。他取代了使用表格定义布局的老式方法。使用<table>元素进行文档布局不是表格的正确方法。<table> 元素的作用是显示表格化的数据。
<div style="color: cadetblue">
<h3>this is a header</h3>
<p>this is a paragraph</p>
</div>在浏览器中显示的是；
浏览器支持
所有主流浏览器都支持<div>标签。
HTML 与 XHTML 之间的差异
在HTML 4.01中，div元素的“align”属性不被赞成使用。
在XHTML 1.0 Strict DTD中，div元素的“align”属性不被支持。
实例：
<html>
<head lang="en">
<meta charset="UTF-8">
<title>NEWS</title>
<style>
.news1
{
color: darkgreen;
font-size: 18px;
}
.news2
{
color: darkred;
font-size: 18px;
}
</style>
</head>
<body>
<h1>NEWS WEBSITE</h1>
<p>some text.some text.some text</p>
...
<!-- onclick点击事件，alert弹框-->
<div class="news1" οnclick="javascript:alert('Im minmin')">
<h2>News headline 1</h2>
<p>some text.some text,some text</p>
...
</div>
<div class="news2">
<h2>News headline 2</h2>
<p>some text,some text,some text</p>
...
</div>
</body>
</html>
HTML <span> 元素
HTML <span>元素，内联元素，可用作文本的容器。
<span> 元素也没有特定的含义。
当与CSS一同使用时，<span>元素可用于部分文本设置样式属性。
实例：
<p><span>some text,</span>some text,</p>
例子解释：如果不对span应用样式，那么span元素中的文本与其他文本不会有任何视觉上的差异。尽管如此，上例中的span元素仍然为p元素增加了额外的结构。
可以对同一个<span>元素应用class 或者 id 属性，但是更常见的情况是只应用其中一种，这两者的主要差异是：
class 用于元素组（类似的元素，或者可以理解为某一类元素，而id用于标示单独的唯一的元素）。
HTML:
<html>
<head lang="en">
<meta charset="UTF-8">
<title>NEWS</title>
<link href="test03.css" type="text/css" rel="stylesheet">
</head>
<body>
<p class="tip"><span>some text,</span>some text,</p>
</body>
</html>CSS
p.tip span
{
font-weight: bold;
color: blue;
}在浏览器显示的效果是：
扫一扫
380
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
