黑马程序员技术交流社区

标题: 基础班基础知识总结 [打印本页]

作者: qulele 时间: 2020-4-1 21:41
标题: 基础班基础知识总结
经过差不多20天的学习，来总结一下自己所学习的知识，先总结html部分的吧；【html标签】（一般页面内容主体都写在body标签里面；一般都为双标签，特殊单标签）
1.标题标签：h1~h6（标题标签）
特点：加粗变大，独占一行
2.段落标签：p
特点：根据浏览器或者盒子大小可以自动换行，段落之前有空隙
3.换行标签：</ br>（单标签）
特点：简单开始一行，与段落不一样
4.文本格式化标签（推荐使用前者）
加粗 strong或b、倾斜em或i、删除线del或s、下划线ins或u（双标签）
5.div和span标签（无语义，盒子装内容）
div布局，一行放一个；span布局，一行可以放多个
6.图像标签和路径：<img>（单标签）
属性：
路径 src是img必须属性；替换文本alt（图片不能显示时，能显示文字）；提示文本title（鼠标放图上，提示文字）；图像宽度width；图像高度height；图像边框border
路径：
相对路径：同一级(直接写名字）；下一级/；上一级../
绝对路径：从盘符开始的路径
7.超链接标签：a
属性：
链接目标地址href是a的必须属性；链接打开方式target：_self默认当前页面打开、_blank新窗口打开；
链接分类：
外部链接（外部网址）、内部链接（网页内部页面名字）、空链接（#）、下载链接（文件或压缩包）、网页元素链接（文本图像影音表格等）、锚点链接（点击链接，快速定位页面某个位置）
锚点链接例子：<a href="# two（名称）"></ a> ;需要跳转的目标标签，在标签里面添加一个id属性=two（a链接里面的名称）
8.特殊字符
<小于号< 、>大于号>、空格 、&和号&（主要了解这些）
9.表格标签：table
thead表头：tr表格中的行、th表格表头单元格标签；
tbody表格主体：tr表格中的行、td表格里的单元格；
tfoot表格底部；
合并单元格：跨行rowspan（删除多余单元格，找不同tr行）；跨列cowspan（删除多余单元格，找同一行tr）；
10.列表标签：
无序列表ul li（有自己默认样式）；有序列表ol li（排序按照数字显示）；自定义列表dt dd（无项目符号，实际开发一般用于页面最下方友情链接等）；
11.表单标签：from
指定接收处理表单数据服务器程序的地址 action："url地址"；
表单数据的提交方式 method："get/post"；
表单名称 name="名称"；
表单控件：input 输入表单元素；select 下拉表单元素；textarea 文本域元素；
①input 输入表单元素：
属性：
type是input最重要的属性；
定义input元素的名称name：属性值用户自定义；
规定input元素的值value：属性值用户自定义；
规定input元素首次加载时默认选中checked：属性值checked；
规定输入字段中的字符最大长度maxlength；
type对应属性值：
可点击无意义按钮 button（多数通过javascript描述）；
复选框（多选框）checkbox；
输入字段和浏览按钮，供文件上传file；
隐藏的输入字段hidden；
图像形式的提交按钮 image；
提示文字输入时变无 placeholder；
密码字段password；
单选按钮radio；
重置按钮reset（清除表单所有数据）；
提交按钮submit（表单数据发给服务器）；
单行的输入字段text（默认宽度为20个字符）；
补充：lable标签（绑定表单元素，当点击lable标签里的文字时，浏览器会自动将焦点转到或选择对应元素上，增加用户体验）
②select下拉表单（至少包含一对option)
属性：option（在option中定义selected="selected",当前选项为默认选项）
③textarea文本域
属性：rows 显示的行数；cols 每行的字符数；

欢迎光临黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2