溫馨提示×

溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

html初學(xué)者測試代碼怎么寫

發(fā)布時間：2022-03-16 11:59:07 來源：億速云 閱讀：146 作者：iii 欄目：web開發(fā)

這篇文章主要介紹了html初學(xué)者測試代碼怎么寫的相關(guān)知識，內(nèi)容詳細易懂，操作簡單快捷，具有一定借鑒價值，相信大家閱讀完這篇html初學(xué)者測試代碼怎么寫文章都會有所收獲，下面我們一起來看看吧。

建立一個文本文檔,復(fù)制粘貼如下代碼.將文件的后綴名改為.html.用谷歌瀏覽器打開可查看效果

有的效果,可能別的瀏覽器不支持.

<!doctype html>

<html>

<head>

<meta charset="GBK">

<title>愛你的阿平</title>

</head>

<body>

<!-- <p><b>定義粗體文本</b></p>

<p><em>定義著重文字</em></p>

<p><i>定義斜體字</i></p>

<p><small>定義小號字<small></p>

<p><strong>定義重要的文本<strong></p>

<p>下標(biāo)<sub>字</sub></p>

<p>上標(biāo)<sup>字</sup></p>

<p><ins>定義插入字</ins></p>

<p><del>定義刪除字</del></p>

<nav>

<a href="/html/">HTML</a>

<a href="/css/">CSS</a>

<a href="/js/">JS</a>

<a href="/jquery">JQuery</a>

</nav>

<section>

<h2>W3C</h2>

<p>World Wide Web Consortium(W3C)是萬維網(wǎng)聯(lián)盟...</p>

</section>

<aside>

<h5>Epcot Center</h5>

<p>The Epcot Center is a theme park in Disney World,Florida</p>

</aside>

<audio controls>

<source src="horse.ogg" type="audio/ogg">

<source src="horse.mp3" type="audio/mpeg">

你的瀏覽器不支持audio元素

</audio>

<br/>

<video width="320" height="240" controls>

<source src="movie.mp4" type="video/mp4">

<source src="movie=ogg" type="video/ogg">

你的瀏覽器不支持video標(biāo)簽

</video>

<br/> <!-- 換行 -->

<!-- 下載進度:

<progress value="30" max="100"></progress>

<br/>

<svg width="1000" height="1000"> <!-- 可伸縮矢量圖形-->

<circle cx="100" cy="50" r="40" fill="red" /> <!-- 圓,省略cx,xy圓心默認就是(0,0)-->

<!-- </svg>

<!-- <svg width="1000" height="1000">

<rect width="400" height="200" x="20" y="20" fill="green" /> <!-- 矩形-->

<!-- </svg>

<!-- <svg width="500" height="510">

<line x1="20" y1="20" x2="300" y2="300"

style="stroke:#000000;stroke-linecap:round; stroke-width:20" /> <!-- 直線-->

<!-- </svg>

<!-- <svg width="2000" height="500" >

<polyline style="stroke-linejoin:miter; stroke:orange; stroke-width:12; fill=none;"

points="100 100,150 150, 200 100" /> <!-- 曲線-->

<!-- </svg>

<svg width="500" heigh="500">

<ellipse cx="200" cy="100" rx="150" ry="30" style="fill:blue" /> <!-- 橢圓-->

<!-- </svg>

<!-- <svg width="1000" height="1000">

<polygon points="100 100,200 200, 300 0"

style="fill:Cyan; stroke:black;" /> <!-- 多邊形-->

</svg>

<!-- <svg width="1000" height="250">

<rect width="150" height="150" fill="orange">

<animate attributeName="x" from="0" to="300" dur="3s" fill="freeze" repeatCount="2" /> <!-- svg動畫-->

</rect> <!-- attributeName(指定產(chǎn)生動畫的屬性),repeatCount(循環(huán)次數(shù),屬性值:indefinite-無限循環(huán)-->

</svg>

<!-- <svg width="500" height="500">

<path d="M50 0 L75 200 L225 200 Z"/> <!-- 路徑-->

</svg>

<!-- <canvas id="myCanvas" width="200" height="100"> <!-- <canvas>標(biāo)簽必須指定一個id(腳本中經(jīng)常引用)-->

<!-- ctx.font="bold 20px Arial;

<!-- ctx.textAlign="阿平加油!"; <!-- 此部分代碼應(yīng)該在js中-->

<!-- ctx.fillText=("阿平加油!",20,40);

</canvas> -->

<br/>

<div class="section">

<form>

username:<input  type="text" name="username" placeholder="用戶名" autofocus required  autocomplete="愛你的阿平"/> <!--autocomplete用法后期講解-->

<input type="submit" value="提交啦"/> <br/><br/>

<input type="search" name="searchitem" align="center"/> <br/><br/> <!--align 貌似在這沒用-->

</form>

<input list="browsers" autocomplete="Safari"/>

<datalist id="browsers"> <!-- 選項列表-->

<option value="Internet Explorer"> <!-- <input>標(biāo)簽可以嵌套在<form>標(biāo)簽內(nèi),也可以放在<body>標(biāo)簽之內(nèi)-->

<option value="Firefox">

<option value="Chrome">

<option value="Opera">

<option value="Safari">

</datalist>

<p align="center">

<img   src="http://m.qpic.cn/psb?/V13EM30s1KV4Be/cyuWdaEOm1w7Wj26pxCJ906Tr4iZc6FEBcwEZvRg7Mo!/b/dDIBAAAAAAAA&bo=CAc4BAAAAAARNzM!&rf=viewer_4"  width="300" height="200" align="center" alt="思念" border="10"/>  <!-- <img>標(biāo)簽的align沒作用,需要放在<p>中,使用屬性align-->

</p>

<a href="https://www.sogou.com/" target="_blank">搜狗</a> <!-- 超鏈接-->

</div>

<ul>

<li>咖啡</li>

<li>茶</li>

<li>牛奶</li>

</ul>

<hr/>

<ol>

<li>咖啡</li>

<li>茶</li>

<li>牛奶</li>

</ol>

<hr/>

<iframe  src="https://www.sogou.com/" wihth="300" height="200" frameborder="10"  align="center"><iframe> <!--內(nèi)聯(lián)框架-->

</body>

</html>

<br>

注意: 有的標(biāo)簽是沒有align屬性的,本代碼中有的align是無效的. 若要測試部分代碼的效果,請把"<!--" 刪除

關(guān)于“html初學(xué)者測試代碼怎么寫”這篇文章的內(nèi)容就介紹到這里，感謝各位的閱讀！相信大家對“html初學(xué)者測試代碼怎么寫”知識都有一定的了解，大家如果還想學(xué)習(xí)更多知識，歡迎關(guān)注億速云行業(yè)資訊頻道。

向AI問一下細節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點不代表本網(wǎng)站立場，如果涉及侵權(quán)請聯(lián)系站長郵箱：is@yisu.com進行舉報，并提供相關(guān)證據(jù)，一經(jīng)查實，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手