html网页制作第六弹


div层标签

div层标签来为HTML文档内大块的内容提供结构和背景元素,就像一个容器一样可大可小,可长可短,可宽可短。HTML页面可中添加div的起始标签和结束标签之间的所有内容都是用来构成这个块的。其中所含有的元素特性由div的属性来控制或者是通过演示样式表格式化这个块来进行控制。


代码示例:

<html>

  <head>

   <title>

        My Page

   </title>

  </head>

  <body>

    <div style="background-color=red;height=58"></div>

<div style="background-color=yellow;height=58"></div>

<div style="background-color=black;height=58"></div>

</body>

</html>


<!--pre标签个人觉得一般用的很少,大家记得就可以-->

效果显示:



注意在设置样式属性值的时候因为已经存在了双引号,所以在设置值得时候就不要再加入双引号了。

table表格标签

table标签用于在HTML网页中创建一个表格,它包含表名和表格本身内容的代码,表格的基本单元是单元格,用<td></td>表示。


<tr></tr>代表行

<td></td>代表列


语法:

<table>

  <tr > <td></td><td></td></tr>

<tr> <td></td><td></td></tr>

</table>

代码示例:

<html>

  <head>

   <title>

        My Page

   </title>

  </head>

  <body> 

<table border="1">

  <tr >

<td>1</td>

<td>1</td>

</tr>

<tr>

 <td>1</td>

<td>1</td>

</tr>

</table>

</body>

</html>

效果显示:


大家注意,table中的border是社会表格的边框大小的,可以修改,可以不加。

在表格中可以设置coslpan属性和rowspan属性,是代表跨列和跨行的效果。大家可以设置试试

表格中也是可以设置高度和宽度,背景颜色,背景图片等属性的,大家都可以尝试一下。

table中的coslpan属性



代码示例:

<html>

<head>

<title>My Page</title>

</head>

<body>

<table border="1">

<tr>

 <td>手机充值</td>

  <td colspan="2">办公文具</td>

</tr>

<tr>

<td rowspan="2">各种卡的汇总</td>

<td>铅笔</td>

<td > 彩笔</td>

</tr>

<tr>

<td>打印</td>

<td>刻录</td>

</tr>

</table>

</body>

</html>


效果显示:


多尝试设置

在table标签中可以设置height="高度" widht="宽度"

以及表格中文字的对齐方式-align=“对其方式”


效果图:


这只是设置了高度宽度和对齐方式,大家尝试一下

那么今天的内容就到这里吧!大家明天见,每天学习一点,每天进步一点。

听雨HTML基础QQ交流群:577919336,大家有兴趣的可以进群交流一下。

或者有问题去听雨的博客反应:

博客地址:http://blog.csdn.net/dx15618816293  

附(因为听雨电脑的原因,可能有时很多尾标签的/没有敲上去,所以如果大家是直接复制我的源码过去的话可能无法显示,建议大家还是自己敲一敲。记住一般情况下标签都是有头标签和尾标签的。)



明天学习很重要的一个知识点 form表单标签
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章