BODY内的标签

Posted 2020-10-09 ㊣蚂蚁小兵

body标签
- 图标 &nbsp;(空格) &gt;(>) &lt;(<)
- P 标签用做段落
- br 换行标签
=======小总结=======
所有标签分为
块级标签:div(白板)H系列(加大加精),p标签(段落和段落之间有间距)
行内标签:span标签(白板)
标签之间可以嵌套
标签存在的意义,定位操作,js/css操作
ps:chorme审查元素的使用
- 定位
- 查看样式
- input系列
input type="text" - name属性 - value="默认值"
input type="password" - name属性 - value="默认值"
input type="submit" - value="提交" 提交按钮 表单
input type="button" - value="登陆" 按钮

input type="radio" -单选框 value,name 属性(name相同则互斥) checked="checked"-默认值
input type="checkbox" -复选框 value,name (批量获取数据) checked="checked"-默认值

input type="file" - 依赖form表单的一个属性 enctype="multipart/form-data"
input type="reset" - 重置

<textarea>默认值</textarea> - name属性 多行文本输入
select - name,option内的value 提交数据,size默认显示数量,multiple多选
optgroup 分组显示 lable分组名称无法选中

- a 标签
- 跳转
- 锚 href="#某个id" id唯一不能重复

- 列表
- ul
- li
- ot
- li
- dl
- dt
- dd

- img
- src 图片地址
- title 提示
- alt

- 表格
- table
- thead
- tr
- th
- tbody
- tr
- td
colspan="" 列合并
rowspan="" 行合并

- label
用与获取光标
<label for="username">用户名：</label>
<input id="username" type="text" name="user" />

- fieldset
- legend

- css
- 在标签内设置style属性
height:50px;
background-color: #09ff9c;

- 编写css样式
1. 标签的style属性中写
2. 写在head里面,style标签中写样式
- id选择区
#i1{
height:50px;
background-color: #09ff9c;
}

- class 选择器
.名称{
}
<标签 class="名称"></标签>

- 标签选择器
div{
...........
}

所有dvi标签都设置成此样式

- 注释
/* */

- 边框
- border
style="border: 1px solid red; 1像素,实体边框线,边框颜色
border-top,border-left,borter-right,border-bottom 四边
- height
- width 可以设置成像素,也可以设置成百分比
- text-aglin 水平方向的对齐
- line-height 垂直方向的对齐

- 字体
- font-size 字体大小 单位像素
- font-weight 字体加粗 bold bolder

- float
让标签浪起来,块级标签也查可以堆叠
body标签里面的 style:margin:0 auto; div可以占满两边
子标签float后,把父标签的边框档住,可以加个clear:both;让你标签的边框显示出来
<div style="clear:both;"></div>

- display
- display:none--让标签消失
- display:inline 块级标签转换成行内标签
- display:block 行内标签转换成块级标签
- display:inlin-block
- 行内标签无法设置高度,宽度,padding,margin
- 块级标签可以设置高度,宽度,padding,margin
- inlin-block 让行内标签可以设置 高度,宽度,padding,margin

- padding margin
- 边距
- margin 外边距
- margin:0 auto 子标签居中
- padding 内边距