Web学习笔记（一）：HTML_web 上上一级-优快云博客

本文链接：https://blog.youkuaiyun.com/weixin_43790325/article/details/107568621

常用标签

字体标签 font
- color: 颜色
- size: 大小 1~7
- face: 改变字体
- p 段落标签
h标题标签 : 1~6(H1最大)
br 换行
hr 水平线
b 加粗
i 斜体
strong : 加粗包含语义
em : 斜体包含语义
img标签
- src : 指定图片的路径
- width: 宽度
- height: 高度
- alt : 图片加载错误时的提示信息
相对路径:
- ./ 代表的是当前路径
- …/ 代表的上一级路径
- …/…/ 代表的上上一级路径
ul: 无序列表
- type :
ol: 有序列表
- type : 样式
- start : 起始索引
- li : 列表项
a 超链接标签
- href : 要访问的链接地址
- target : 打开方式
table标签
- border: 指定边框
- width : 宽度
- height : 高度
- bgcolor : 背景颜色
- align : 对齐方式
- tr标签(行)
- td标签(列)
colspan : 跨列操作
rowspan : 跨行操作

注意: 跨行或者跨列操作之后,被占掉的格子需要删除掉

<head>
    <meta charset="UTF-8">
    <!--搜索关键字-->
    <meta name="keywords" content="Java">
    <!--网页的描述-->
<title>一个假网页</title>
</head>

<!--网页主体-->
<body>
<!--标题标签-->
<!--H1最大，H6最小-->

一级标签

二级标签

三级标签

哈哈哈

hhh

啦啦啦
看看看看

哈哈哈
哦哦哦

大于号 : >

小于号 : <

空格 : 你好

引号:"

版权符号: ©版权所有

这是一张图片

超链接

发送邮件

新网页打开百度
 本网页打开百度

Title

用户名:

<!--密码框 input type="password"-->
<p>密码:<input type="password" name="password" placeholder="请输入密码" required></p>



<p>
    <!--文件域-->
    <input type="file">
</p>

<p>
    <!--单选框-->
    <!--
    name 绑定同一个组
    -->
    <!--
    注意:
    1.若是要提交,必须有name和value属性
    2.name就是提交的键值对,value就是提交的信息
    -->
    性别:
    <input type="radio" name="sex">男
    <input type="radio" name="sex">女

</p>

<p>
    <!--checkbox 多选框-->
    <input type="checkbox" value="movie" name="hobby">看电影
    <input type="checkbox" value="music" name="hobby">听歌
    <input type="checkbox" value="road" name="hobby">压马路
    
</p>



<hr>

<!--下拉框-->
<!--checked 默认选中-->
<select name="列表名称">
    <option value="选择的值1">1</option>
    <option value="选择的值2" selected>2</option>
    <option value="选择的值2">3</option>

</select>

<!--文本域-->
<p>
    <textarea name="文本" id="" cols="30" rows="10" ></textarea>
</p>

<!--按钮-->
<input type="button" value="我的第一个button按钮">
<hr>

<!--邮箱-->
<!--
patten 正则表达式
-->
邮箱<input type="email" name="email" placeholder="请输入邮箱" pattern="/^([0-9A-Za-z\-_\.]+)@([0-9a-z]+\.[a-z]{2,3}(\.[a-z]{2})?)$/g">
<br>
<!--url简单校验-->
URL<input type="url" name="url">
<br>
<!--数字的简单校验-->
数字<input type="number" name="num">
<!--滑块-->
<input type="range" name="range" value="30">
<br>
<!--搜索框-->
搜索框<input type="search" name="search" readonly>

<!--提交按钮 input type = submit-->
<!--submit默认文字是提交-->
<p><input type="submit" name="Button">
    <!--重填按钮-->
    <input type="reset" name="Button">
</p>