- HTML标签学习笔记
1.标签是通过<p>定义的(<p></p>分别为开始标签和结束标签必须是成组出现)
段落通过<p>标签定义
(1)标签<p>每个独立一行
(2)标签<span>是一行,取决于里面内容的宽度(span行内元素左右排列))
2.链接是通过<a>定义的(a标签是行内元素)
每点击一次都是打开一个新的网页在head标签里面<base href="" target="_blank">
锚点链接:找到当前页面自己想看的一部分
(1)实现页面跳转同时实现锚点跳转
当前页面:
<a href="b.html#aaa">跳转到b页面aaa处</a>
另一页面:
<a name="aaa" id="aaa">aaa</a>
3.插入图片(相对路径)并设置其高度宽度
(img行内元素左右排列)
<img src="/images/logo.png" width="258" height="39" />
4.标题是通过<h>标签定义的,h1是最大标签,h标签是在a标签里面
注:align是对齐属性。它的值可以是left、center、right,分别表示靠左、中、右,肯定效果是不同的,当然,如果要对齐的内容和容器大小相同,比如你加在里面的图片宽度和窗口相同,那么对齐就没有区别,否则是有区别的
5.标签<hr>用于在页面创建水平线
6.HTML注释 ctrl+/
7.<!-- 不产生新的空格换行 -->
<p>懒洋洋<br>在睡觉</p>
8.HTML列表元素
- 无序列表<ul>
- 列表项item必须嵌套在li标签里面
- 如有<a>或者<img>标签可以将其写在li标签里面
- type属性,可以更改运行结果中前面的图形。disc点,square方块,circle圆,none无
- (2)有序列表<ol>
- type属性,可以更改运行结果中前面的数字类型。A大写字母,I大写罗马数字,a小写字母,i小写罗马数字
- Start属性定义序号开始的位置
- (3)定义列表<dl>
- 内部可以有多个列表标题,列表标题用<dt>标签定义
- 列表项内部有多个可以用<dd>标签定义
- 9.HTML表格元素
- (1)行tr,列td
- (2)Table里面属性 边框border,内边距cellpadding,外边距cellspacin
注:bgcolor是用于设置元素的背景颜色的属性。
- td有两个属性
colspan单元格跨行 rowspan单元格跨列
(4)定义表格标题
<caption>标题</caption>
10.HTML表单元素
(1)单行文本框
<input type="text" name="user" id="user" value="javas" placeholder="请输入用户名">
(2)密码输入框
<input type="password" name="psd" id="" placeholder="请输入密码">
(3)单选按钮
<input type="radio" name="gender" id="male" value="male"><label for="male">男</label>
<input type="radio" name="gender" id="female" value="female"><label for="female">女</label>
(4)多选按钮
<!-- checked默认选中 属性和属性值一致时候可以直接写属性-->
<input type="checkbox" name="hobby" value="shi" id="" checked>网球
<!-- checked默认选中 -->
<input type="checkbox" name="" id="" checked="checked">乒乓球
<input type="checkbox" name="" id="">足球
(5)重置按钮
<!-- 重置 -->
<input type="reset" name="" id="">
(6)图片形式提交按钮
<!-- 图片提交按钮 src -->
<input type="image" name="" id="" src="../img/111.jpg" height="50" width="50">
(7)选择文件控件
<!-- 选择文件 -->
<input type="file" name="" id="">
注意:input对应两个属性值name,value从这两个参数获取
<!-- 类型 文本输入框 value一开始就有值,控制文本框本内容 placeholder无内容是提示的信息-->
<input type="text" name="user" id="user" value="javas" placeholder="请输入用户名">
<input type="password" name="psd" id="" placeholder="请输入密码">
(8)select定义列表(下拉框,size设置选择栏高度,multiple决定多选列表还是单选列表)
Option定义列表项
<select name="" id="" multiple="">
<option value="">1</option>
<option value="">2</option>
<option value="">3</option>
</select>
如果想让哪一个默认选中可以checked=”checked”或者checked
<!-- checked默认选中 -->
<input type="checkbox" name="" id="" checked="checked">乒乓球
(9)textarea标签中cols和rows定义文本框列数和行数
<!-- 区域 -->
<textarea name="" id="" cols="30" rows="10" placeholder="aaaa"></textarea>