html初学(二)

时间:2023-03-08 19:39:49
html初学(二)

 <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> <table border="1"><!--这里说表格带表框-->
<tr style="text-align:center;"><!--这里是写第一行的东西-->
<th>第一列的头</th>
<th>第二列的头</th>
<th>第三列的头</th>
</tr> <tr style="text-align:center;"><!--这里是写第二行的东西-->
<td>第一列</td>
<td>第二列</td>
<td>第三列</td>
</tr> <tr style="text-align:center;"><!--这里是写第三行的东西-->
<td>
<ul>
<li>第一列</li>
<li>第一列</li>
<li>第一列</li>
</ul>
</td>
<td>
<table border="1">
<tr>
<td>第二列</td>
<td>第二列</td>
</tr>
<tr>
<td>第二列</td>
<td>第二列</td>
</tr>
</table>
</td>
<td>第三列</td>
</tr> <ol start="50">
<li>这里是有序列表list1</li>
<li>这里是有序列表list2</li>
</ol> <ul>
<li>这里是无序列表</li>
<li>这里是无序列表</li>
</ul> <ol type="A"><!--这里可以改成type="a"、type="I"、type="i"-->
<li>这里是有序列表listA</li>
<li>这里是有序列表listB</li>
</ol> <div style = "color:#C6A300;">
<h4>不管是标题还是正文</h4>
<p>这一块都是这个颜色了</p>
<p>这是一片是<span style = "color:blue;font-weight:bold">蓝色</span>
这一片是<span style = "color:darkolivegreen;font-weight:bold">碧绿色</span>
</div> <hr>
<!--下面做一个大区域的东西-->
<div id = "container" style = "width:500px">
<div id = "header" style = "background-color:#FFA500;width:500px">
<h1 style="margin-bottom:0;">
这里是标题
</h1>
</div>
<div id = "menu" style = "background-color:#FFD700;height:300px;width:100px;float:left;">
<b>Menu</b>
<br/>
html
<br>
css
<br>
JavaScript
</div>
<div id = "content" style="background-color:#EEEEEE;height:300px;width:400px;float:left;">
1、这里是正文
<br/>
<form>
这里是文本框: <input type="text" name="textbox">
<br/>
密码: <input type="password" name="pwd">
<input type="submit" value="Submit">
</form>
<form>
<input type="radio" name="sex" value="male">Male
<br/>
<input type="radio" name="sex" value="female">Female
<br/>
<input type="checkbox" name="sex" value="notmale">not male
<br>
<input type="checkbox" name="sex" value="notfemale">not female
</form>
<br/>
<textarea rows="2" cols="20">
我是一个文本框。
</textarea>
<br/>
<form action="">
<input type="button" value="Hello world!">
</form>
</div>
<div id = "footer" style="background-color:#FFA500;clear:both;text-align:center;width:500px;">
Copyright © TTyb
</div>
</div>
<br/>
<hr>
<script>
document.write("<strong><big>Hello World!</big></strong>")
</script>
<br/>
<br/>
<p id="demo">
这里要发生奇迹
</p>
<script>
function myFunction()
{
demo = document.getElementById("demo")//找到demo
demo.innerHTML="Hello JavaScript!";//替换demo
demo.style.color="#ff0000";//变化格式
}
</script>
<br/>
<button
type="button" onclick="myFunction()">Click Me!
</button>
</body>
</html>
  • 这里是有序列表list1
  • 这里是有序列表list2
  • 这里是无序列表
  • 这里是无序列表
  • 这里是有序列表listA
  • 这里是有序列表listB

不管是标题还是正文

这一块都是这个颜色了

这是一片是蓝色 这一片是碧绿色

这里是标题

Menu
html

css

JavaScript
1、这里是正文

这里是文本框:

密码:

Male

Female

not male

not female

我是一个文本框。

Copyright © TTyb

这里要发生奇迹

Click Me!

第一列的头 第二列的头 第三列的头
第一列 第二列 第三列
  • 第一列
  • 第一列
  • 第一列
第二列 第二列
第二列 第二列
第三列