首頁 web前端 html教學 Html小知識總結

Html小知識總結

Jan 16, 2017 am 11:51 AM
html

1、跳出新頁:

target="_self"不跳轉

form表單提交的跳轉設定

2.點選按鈕跳出別的頁面加入

onclick="return false"

3、display:block;區塊級元素,也就是說它可以設定一些寬高,獨佔一行,例如,div元素,p元素等display:inline-block,行級元素,也就說它可以使得同樣設定成行級元素的元素一起在一行,然後可以設定寬高,這個適應於製作一個導航選單,將每個選單項目設定成行級元素。它的寬和高預設是內容的寬和高,典型的元素是表單類別的元素。 dispaly:inline.行級元素,不可設定寬和高,預設寬高是內容的寬和高,典型的比如,span,

4、html滑鼠小手:

cursor:pointer;

5、html背景圖屬性:

background-size:100%;,但是你的圖片寬度,高度要設定成100% ,要注意的是.php的檔案裡面這個background-image:url();不好用,失效,你要使用網站的絕對路徑background:url('/20151106/404/image/404.png') no-repeat 4px 5px;}background:url("11111.jpg");background-repeat:no-repeat; background-size:100%;width:100%;height:100%;

這個是給頁面加背景的body{padding: 0px;margin: 0px;background-color:#494949;width:100%;height:100%; 100%;}.

還有在設定背景圖片的時候可以使用背景background-image:url("");這個屬性來設定背景,但是圖片要用gif的格式

6、以輸出方式來顯示文字格式:

登入後複製
橫線:
雙引號標籤底線

7、html---position/relative/absolute/fixed /三種佈局定位方式的總結relative是按照自身來說,absolute是按照瀏覽器來說,但是要注意的是,如果他有父級元素的話,那麼他就是依照父級元素來進行改變位置的。

8、無序列表去掉前面黑點li{list-style:none;}

9、隱藏元素- display:none或visibility:hidden

display-這個元素,設定之後原本的元素不會佔用目前原本的元素不會佔用目前的空間,不會影響佈局,但是後者,隱藏之後還會佔用空間

10、HTML隱藏多餘

Div{overflow:hidden}

10、隱藏自適應:overflow:auto;

11、關於框架的問題

這個是接受你要顯示頁面

indx.php是框架顯示的頁面,最上面,也就是沒按鍵顯示

這個是你點擊之後想在哪顯示後面加:target=""

新增分類

12、關於背景的高的問題,也就是說你定義了一個div但是沒有搞,是為了讓你的圖片在上面。那麼就有這個屬性了

overflow:hidden;

也就是你本身是屬於父級元素的,但是你float就脫離了文本,變成浮動的,所有就不會在用父子元素的空間,所以就父級加上這個overflow:hidden;

13、錨點的設定

在你想跳轉的頁面的地方加上:

然後在你想加連結的地方加上去找錨點

14.點擊換驗證碼圖片

15、圓角

border-radius:5px ;

16、textarea的左側文字在最左邊

style="vertical-align:top"


17、html塊狀元素和內聯元素的總結,塊狀元素可以設定margin,但是使用margin的時候要符合:1.塊狀元素,2.有寬高,其中內聯元素不能設定margin和寬高的屬性,只能設定padding

塊狀元素清單:

定義位址

定義表格標題

定義清單中定義項目

定義文件中的分區或節

列表

定義列表中的項目

定義一個框架集

創建HTML 表單

定義最大的標題

定義副標題

定義標題

定義標題

定義標題

定義最小的標題


建立一條水平線

元素為

創建一條水平線

元素為

標籤定義列表項目

為那些不支援框架的瀏覽器顯示文本,於frameset 元素內部<br><br><noscript>定義在腳本未被執行時的替代內容<br><br><ol>定義有序列表<br><br> </ol> <ul>定義無序列表<br><br><p>標籤定義段落<br><br></p> </ul> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">定義預先格式化的文字&lt;br&gt;&lt;br&gt;</pre><div class="contentsignin">登入後複製</div></div> <table>標籤定義HTML 表格<br><br><tbody>標籤表格(正文)<br> <td>表格中的標準單元格<br><br> </td> </tbody> <tfoot>定義表格的頁腳(腳註或表註)<br><br><th>定義表頭單元格<br><br><thead>標籤定義表格的表頭<br><tr>定義表格中的行<h2></h2>內聯元素列表<p><br><a>標籤可定義錨<br><br><abbr>表示一個縮寫形式<br><br><acronym>定義只取首字母縮寫<br><br><b>加粗字體加粗字體加粗<br><bdo>可覆寫預設的文字方向<br><br><big>大號字體加粗<br><br><br>換行<br><br><cite>引用定義<br><br><code>定義電腦程式碼文字&lt;br&gt;&lt;cite&gt;引用進行定義&lt;br&gt;&lt;br&gt;&lt;code&gt;定義電腦程式碼文字&lt;br&gt;&gt;定義一個&lt;fn&gt;&lt;/fn&gt;&lt;br&gt;&lt;em&gt;定義為強調的內容&lt;br&gt;&lt;br&gt;&lt;i&gt;斜體文字效果&lt;br&gt;&lt;br&gt;&lt;img alt=&quot;Html小知識總結&quot; &gt;向網頁中嵌入一幅圖像&lt;br&gt;&lt;br&gt;&lt;input&gt;輸入框&lt;br&gt;定義鍵盤文字&lt;br&gt;&lt;input&gt;輸入框&lt;br&gt;定義鍵盤文字&lt;br&gt; label&gt;標籤為&lt;br&gt;&lt;br&gt;&lt;input&gt; 元素定義標註(標記)&lt;br&gt;&lt;br&gt;&lt;q&gt;定義短的引用&lt;br&gt;&lt;br&gt;&lt;samp&gt;定義樣本文字&lt;br&gt;&lt;br&gt;&lt;select&gt;建立單選或多選選單&lt;br&gt;小號字體效果&lt;br&gt;&lt;br&gt;&lt;span&gt;組合文件中的行內元素&lt;br&gt;&lt;br&gt;&lt;strong&gt;語氣更強的強調的內容&lt;br&gt;&lt;br&gt;&lt;sub&gt;定義下標文字&lt;br&gt;&lt;br&gt;&lt;sup&gt;定義上標文字&lt;br&gt;&lt;br&gt;&lt;textarea&gt;多行的文字輸入控制項&lt;br&gt;&lt;br&gt;&lt;tt&gt;打字機或等寬的文字效果&lt;br&gt;&lt;br&gt;&lt;var&gt;定義變數&lt;/var&gt;&lt;/tt&gt;&lt;/textarea&gt;&lt;/sup&gt;&lt;/sub&gt;&lt;/strong&gt;&lt;/span&gt;&lt;/select&gt;&lt;/samp&gt;&lt;/q&gt;&lt;/i&gt;&lt;/em&gt;</code></cite></code></cite></big></bdo></b></acronym></abbr></a></p>🎜</tr> </thead> </th> </tfoot> </table> </noscript>
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

熱門話題

Java教學
1655
14
CakePHP 教程
1413
52
Laravel 教程
1306
25
PHP教程
1252
29
C# 教程
1226
24
HTML 中的表格邊框 HTML 中的表格邊框 Sep 04, 2024 pm 04:49 PM

HTML 表格邊框指南。在這裡,我們以 HTML 中的表格邊框為例,討論定義表格邊框的多種方法。

HTML 中的巢狀表 HTML 中的巢狀表 Sep 04, 2024 pm 04:49 PM

這是 HTML 中巢狀表的指南。這裡我們討論如何在表中建立表格以及對應的範例。

HTML 左邊距 HTML 左邊距 Sep 04, 2024 pm 04:48 PM

HTML 左邊距指南。在這裡,我們討論 HTML margin-left 的簡要概述及其範例及其程式碼實作。

HTML 表格佈局 HTML 表格佈局 Sep 04, 2024 pm 04:54 PM

HTML 表格佈局指南。在這裡,我們詳細討論 HTML 表格佈局的值以及範例和輸出。

HTML 輸入佔位符 HTML 輸入佔位符 Sep 04, 2024 pm 04:54 PM

HTML 輸入佔位符指南。在這裡,我們討論 HTML 輸入佔位符的範例以及程式碼和輸出。

HTML 有序列表 HTML 有序列表 Sep 04, 2024 pm 04:43 PM

HTML 有序列表指南。在這裡我們也分別討論了 HTML 有序列表和類型的介紹以及它們的範例

HTML onclick 按鈕 HTML onclick 按鈕 Sep 04, 2024 pm 04:49 PM

HTML onclick 按鈕指南。這裡我們分別討論它們的介紹、工作原理、範例以及各個事件中的onclick事件。

在 HTML 中移動文字 在 HTML 中移動文字 Sep 04, 2024 pm 04:45 PM

HTML 中的文字移動指南。在這裡我們討論一下marquee標籤如何使用語法和實作範例。

See all articles