页面结构
<body>
<header>
<h2>网页头部</h2>
</header>
<nav>
<h3>导航类辅助内容</h3>
</nav>
<article>
<h3>独立文章内容</h3>
</article>
<aside>
<h3>相关内容或应用（常见于侧边栏）</h3>
</aside>
<section>
<h2>网页主体</h2>
</section>
<footer>
<h2>网页底部</h2>
</footer>
</body>iframe内联框架
<body>
<!--
iframe内联框架
src 地址
w-h 宽度和高度
-->
<iframe src="" name="baidu" frameborder="0" width="1000px" height="800px"></iframe>
<!--通过a标签添加-->
<a href="https://blog.csdn.net/java_dog_dog" target="baidu">点击跳转</a>
</body>表单的学习 post和get
<body>
<h1>注册</h1>
<!--表单form
action ：表单提交位置，可以是网站，也可以是一个请求处理地址
method ：post ， get 提交方式
get 提交可以在url上看到提交的信息，不安全，高效
post 比较安全，传输大文件
-->
<form action="https://blog.csdn.net" method="post">
<!-- 文本输入框：input type="text"-->
<p>名字： <input type="text" name="username"></p>
<!-- 密码框：input type="password"-->
<p>密码： <input type="password" name="pwd"></p>
<p>
<!-- 提交-->
<input type="submit">
<!-- 重置-->
<input type="reset">
</p>
</form>
</body>表单元素属性
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表单的学习</title>
</head>
<body>
<h1>注册</h1>
<!--表单form
action ：表单提交位置，可以是网站，也可以是一个请求处理地址
method ：post ， get 提交方式
get 提交可以在url上看到提交的信息，不安全，高效
post 比较安全，传输大文件
-->
<form action="https://blog.csdn.net" method="post">
<!-- 文本输入框：input type="text"
value="java狗" 默认值
maxlength="10" 最长能写几个字符
size="15" 文本框长度
readonly 只读
hidden 隐藏
placeholder="请输入用户名" 提示信息
required 不能为空
-->
<p>名字： <input type="text" name="username" value="java狗" placeholder="请输入用户名" required></p>
<!-- 密码框：input type="password"
-->
<p>密码： <input type="password" name="pwd" maxlength="10" size="15" required></p>
<!-- 单选框
input type="radio"
value="boy" 表示单选框里的值
name="sex" 标示组
checked 默认选中
disable 禁用
-->
<p>性别：
<input type="radio" value="boy" name="sex" checked>男
<input type="radio" value="girl" name="sex">女
</p>
<!-- 多选框-->
<p>
<input type="checkbox" value="sleep" name="hobby">睡觉
<input type="checkbox" value="code" name="hobby">打代码
<input type="checkbox" value="ball" name="hobby">篮球
<input type="checkbox" value="chat" name="hobby">聊天
</p>
<p>
<!-- 按钮
input type="button" 按钮
input type="image" 图片按钮
input type="submit" 提交按钮
input type="reset" 重置按钮清空表单
-->
<input type="button" name="button" value="点击变大">
<input type="image" src="../resources/imgs/aaa.jpg">
</p>
<!-- 下拉框，列表框
selected 默认选择
-->
<p>
<select name="列表名称" id="">
<option value="china" selected>中国</option>
<option value="India">印度</option>
<option value="USA">美国</option>
<option value="Jpn">日本</option>
</select>
<!--文本域
cols="10" rows="20" 列和行
-->
<p>反馈：
<textarea name="textarea" id="textarea" cols="10" rows="20">文本内容</textarea>
</p>
<!-- 文件域 -->
<p>
<input type="file" name="files">
<input type="button" name="upload" value="上传">
</p>
</p>
<!-- 邮箱验证-->
<p>邮箱验证：
<input type="email" name="email">
</p>
<!-- url验证-->
<p>url验证：
<input type="url" name="url">
</p>
<!-- 数字 验证-->
<p>数字验证：
<input type="number" name="num" min="0" max="50" step="10">
</p>
<!-- 滑块-->
<p>滑块：
<input type="range" name="voice" min="0" max="100" step="2">
</p>
<!-- 搜索框-->
<p>搜索框：
<input type="search" name="search">
</p>
<!-- 增强鼠标的可用性-->
<p>
<label for="mark">你点我试试</label>
<input type="text" id="mark">
</p>
<!-- pattern正则表达式-->
<p>自定义邮箱：
<input type="text" name="diymail" pattern="/w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*">
</p>
<p>
<!-- 提交-->
<input type="submit">
<!-- 重置-->
<input type="reset">
</p>
</form>
</body>
</html>
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
