今天学习了列表、表格与媒体元素
列表{
ul:无序列表
ol:有序列表
dl:定义类表(dt为声明列表项|di为定义列表项)
}
表格{
表格的使用:使用<table>、<tr>、<td>创建表格
表格装饰:使用bgcolor、align、等等
制作跨列、跨行的表格:跨列:colspan="横向跨的单元格数"|||跨行:rowspan="纵向跨的单元格数"
}
媒体元素{
视屏元素:<video src="视频路径" controls></video>
适配:
<video >
<source src="video/video.webm" type="video/webm"/>
<source src="video/video.mp4" type="video/mp4"/>
</video>
音频元素:<audio src="音频路径" controls></video>
适配:
<audio controls>
<source src="music/music.mp3" type="audio/mpeg"/>
<source src="music/music.ogg" type="audio/ogg"/>
</audio>
}
结构元素:{header、section、article、nav、aside、footer、div}
iframe{
<iframe src="path" name="mainFrame" ></iframe>
<iframe>属性(实现页面间的相互跳转)
在被打开的框架上加name属性
<iframe name="mainFrame" src="subframe/the_second.html" />
在超链接上设置target目标窗口属性为希望显示的框架窗口名
a href="subframe/the_second.html " target="mainFrame">下边显示第二页</a>
}
接下来学的是表单元素
最基本的 表单框架
<form method="post" action="result.html">
<p> 名字:<input name="name" type="text" > </p>
<p> 密码:<input name="pass" type="password" > </p>
<p> <input type="submit" name="Button" value="提交"/>
<input type="reset" name="Reset" value="重填“/> </p> </form>
input元素:
type{指定元素的类型。text、password、checkbox、radio、submit、reset、file、hidden、image 和 button,默认为 text}
name{指定表单元素的名称}
value{元素的初始值。type 为 radio时必须指定一个值}
size{指定表单元素的初始宽度。当 type 为 text 或 password时,表单元素的大小以字符为单位。对于其他类型,宽度以像素为单位}
max{type为text 或 password 时,输入的最大字符数}
checked{type为radio或checkbox时,指定按钮是否是被选中}
文本框:<input type="text" name="文本框名称" value="文本框初始值" size="文本框长度" maxlength="文本框可输入最多字符" />
密码框:<input type="password " name="密码框的名称" size="密码框的长度" />
注:单选框:{
<input name="gen" type="radio" value="男" checked />男
<input name="gen" type="radio" value="女" />女
其中name值要一致,不一致则不会单选}
复选框:
<input type="checkbox" name="interest" value="值"/>运动
<input type="checkbox" name="interest" value="值" checked (复选框选中状态)/>聊天
<input type="checkbox" name="interest" value="值"/>玩游戏
下拉列表框:
<select name="列表名称" size="行数">
<option value="选项的值" selected="selected">…</option >
<option value="选项的值">…</option >
</select>
按钮:
重置按钮:<input type="reset" name="butReset" value="按钮上显示的文字">
图片:<input type="image(提交按钮)" src="路径" />
普通按钮:<input type="button" name="butButton" value="button按钮"/>
本文地址:https://blog.csdn.net/qq_49384528/article/details/107390925