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表單標籤
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章