网站开发必知基础（html)

youshini

浏览: 221046 次
性别:
来自: 广州

最近访客更多访客>>

xiaguangme

chenglibang

jdzctais

horsehome

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

ajax

HTML ASP CSS

1.div

定义和用法

<div> 可定义文档中的分区或节（division/section）。

<div> 标签可以把文档分割为独立的、不同的部分。它可以用作严格的组织工具，并且不使用任何格式与其关联。

如果用 id 或 class 来标记 <div>，那么该标签的作用会变得更加有效。

用法

<div> 是一个块级元素。这意味着它的内容自动地开始一个新行。实际上，换行是 <div> 固有的唯一格式表现。可以通过 <div> 的 class 或 id 应用额外的样式。

不必为每一个 <div> 都加上类或 id，虽然这样做也有一定的好处。

可以对同一个 <div> 元素应用 class 或 id 属性，但是更常见的情况是只应用其中一种。这两者的主要差异是，class 用于元素组（类似的元素，或者可以理解为某一类元素），而 id 用于标识单独的唯一的元素。

Code:

<body>
<h1>NEWSWEBSITE</h1>
<p>sometext.sometext.sometext...</p>
...
<divclass="news">
<h2>Newsheadline1</h2>
<p>sometext.sometext.sometext...</p>
...
</div>
<divclass="news">
<h2>Newsheadline2</h2>
<p>sometext.sometext.sometext...</p>
...
</div>
...
</body>

//以上内容：http://www.w3cschool.cn/tag_div.asp.htm

//div在应用系统网站中，是运用得比较多的html标签之一。

//id属性：作为唯一标识，便于dom操作。 class属性：一般用来引用外部的CCS样式表，渲染表现作用。

2.<ul> 标签定义了无序列表。

Code:

<html>
<body>
<h4>一个无序列表：</h4>
<ul>
<li>咖啡</li>
<li>茶</li>
<li>牛奶</li>
</ul>
</body>
</html>

代码结果：

●咖啡

●茶

●牛奶

其type属性：type="circle" 或type="disc" 或 type="square“

提示：请使用样式来定义列表的类型。

3.table

定义和用法

<table> 标签定义 HTML 表格。

简单的 HTML 表格由 table 元素以及一个或多个 tr、th 或 td 元素组成。

tr 元素定义表格行，th 元素定义表头，td 元素定义表格单元。

更复杂的 HTML 表格也可能包括 caption、col、colgroup、thead、tfoot 以及 tbody 元素。

单元格填充(Cell padding)

本例演示如何使用单元格填充来创建单元格内容与其边框之间的空白。

单元格间距(Cell spacing)

本例演示如何使用单元格间距增加单元格之间的距离。

4.span

<span> 标签被用来组合文档中的行内元素。

例子

<p><span>some text.</span>some other text.</p>

例子解释

如果不对 span 应用样式，那么 span 元素中的文本与其他文本不会任何视觉上的差异。尽管如此，上例中的 span 元素仍然为 p 元素增加了额外的结构。

可以为 span 应用 id 或 class 属性，这样既可以增加适当的语义，又便于对 span 应用样式。

可以对同一个 <span> 元素应用 class 或 id 属性，但是更常见的情况是只应用其中一种。这两者的主要差异是，class 用于元素组（类似的元素，或者可以理解为某一类元素），而 id 用于标识单独的唯一的元素。

提示：事实上，您也许已经注意到了，W3CSchool 站点上有一些文本的样式与其他文本是不同的。比如“提示”使用了粗体的橘红色。尽管实现这种效果的方法非常多，但是我们的做法是：使用“提示”使用 span 元素，然后对这个 span 元素的父元素，即 p 元素应用 class，这样就可以对这个类的子元素 span 应用相应的样式了。

HTML:

Code:

<pclass="tip"><span>提示：</span>.........</p>

CSS:

Code:

p.tipspan{
font-weight:bold;
color:#ff9955;
}

学习查阅网站：http://www.w3cschool.cn/tag_span.asp.htm

分享到：

bitbucket 初用 | junction.exe 学习

2010-11-25 08:59
浏览 804
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论