溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這是我寫的第一篇博客！剛剛從學校踏入工作崗位，以前學習的是java，到公司之后才知道在web開發之中還包括了前端，UI，美工，后臺，數據庫抽取，項目經理等職位。前端工程師應用HTML，CSS，AJAX等前端開發技術進行web前端的開發，直接編寫向客戶進行展示的部分的職位。想要做前端開發首要的學習的就是HTML的編寫，通過它才能編寫出展示的頁面。
HTML語言的定義：超文本標記語言。我自己的理解就是一些可以控制頁面元素的標簽的集合。
一，HTML標簽
這是一個綜述，<p></p>這既是一個標簽一個最簡單的段落標簽，前面的是開始標簽，后面的結束標簽。在html4中如果沒有結束標簽也可以進行完整的顯示的，但是在XHTML中以及以后的HTML5中結束標簽是必須存在的，所以在以后的書寫過程中結束標簽是必不可少，即使是像換行的標簽<br/>。
二，HTML基礎
1，HTML的標題和段落
<h2>-<h7>都是是用來定義標題的文本標簽，他們的大小粗細是順序是<h2> > <h3> > <h4>的順序來排列的。
段落標簽是<p></p>,瀏覽器會在段落的前后自動的加上空格。使用<p></p>插入一個空行是一個不好的習慣，要是想插入一個空行可以使用<br/>。如果想在不產生新的段落的情況下進行換行也可以使用<br/>。
2，HTML的樣式
用style屬性來改變HTML元素的樣式。
style屬性的作用是提供了一種改變所有HTML樣式的通用方法。
例子：<body style="background-color:#609">
<h3 style="background-color:#0C0">this is title</h3>
<p style="background-color:#FF0"> this is a paragraph</p>
</body>
上邊的例子就是用來改變背景顏色。
第二個例子是設置文本的對齊方式
例子：<body style="background-color:#609">
<h3 style="text-align:center">this is title</h3>
<p style="background-color:#FF0"> this is a paragraph</p>
</body>
默認的對齊方式是左對齊。
3，HTML的超鏈接和錨標簽
HTML的超鏈接用<a>標簽實現，href屬性定義的所要連接的位置或者文檔。
例子：<a href="http://www.baidu.com/" target="_blank">連接到百度</a>
上述例子中的target屬性的作用是規定鏈接打開的位置，上面的例子就是新打開一個頁面在其中顯示百度的主頁面。
<a>的除了可以連接到其他網頁外還可以連接到本網頁的其他位置也就是錨標記。定位標記：
<a name="標記名">，跳到標簽處的寫法：<a href="#定位標記名">這樣就可以調到當前頁面的指定位置。
例子：<p>
<a href="#C4">查看 Chapter 4。</a>
</p>
<p>This chapter explains ba bla bla</p>
<h3>Chapter 3</h3>
<p>This chapter explains ba bla bla</p>
<h3><a name="C4">Chapter 4</a></h3>
<p>This chapter explains ba bla bla</p>
<h3>Chapter 5</h3>
<p>This chapter explains ba bla bla</p>
當想要直接連接到跳轉后的頁面想要的位置是也可以通過起來實現：
<a href="http://www.smalluv.com/somepage.html#tips">Jump to the Useful Tips Section</a>
在跳轉的頁面中會有：<a name="tips">Jump to the Useful Tips Section</a>
4，HTML表格
HTML中的表格由<table>來定義。<tr>用來定義每個表格的行，<td>用來定義每個單元格。
例子：
<table width="200" border="1">
<tr>
<td>first</td>
<td>last</td>
</tr>
<tr>
<td>第一個</td>
<td>第二個</td>
</tr>
</table>
如何設置表格的表頭？，我們可以使用<th>標簽進行表頭的設置。
例子：
<table border="1">
<tr>
<th>時間</th>
<th>事件</th>
</tr>
<tr>
<td>1990-09-11</td>
<td>金門事件</td>
</tr>
</table>
有的時候空的單元格的邊框不會被顯示出來（在fireFox瀏覽器中可以）；為了避免這種事件的發生，通常在空的單元格中使用占用符來使它的邊框顯示出來。
<td> </td>
其他小方法：
1，如何使表格帶標題?
在<table>的標簽下使用<caption>標簽
<caption> 表格的標題</caption>
2,如何合并單元格？在需要合并的位置加上colspan（和并列）或者rowspan（合并行）
<th rowspan="2">合并</th>
3,如何設置單元格邊距和單元格間距？
邊距：<table cellpadding="10">
間距：<table cellspacing="10">
5，HTML的列表
HTML中的列表可以分為有序列表和無序列表。
（1）無序列表：
起始于<ul> 標簽。每個列表項始于 <li>。
例子：
<ul>
<li>Coffee</li> <li>Milk</li> </ul>
<ol>
<li>Coffee</li> <li>Milk</li> </ol>
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
