博客列表 >链接元素,列表元素,表格元素,表单元素学习笔记

链接元素,列表元素,表格元素,表单元素学习笔记

移动用户-5435854
移动用户-5435854原创
2020年04月04日 16:51:17552浏览

0403 html 基础知识 2

1.语义化元素

  • <h1>-<h6> ;标题标签,划分段落
  • <header>:页眉,页面头部,一个页面里面可以有多个 header
  • <main>:主体内容,一个页面只有一个
  • <section>:功能区块
  • <aside>:侧边栏(广告位,排行,相关商品)
  • <footer>:页脚,一个页面里面可以有多个 header
  • <nav> :导航
  • <div>:通用容器(什么都能装)

2.语义化的文本元素

  • <p>, <pre>,<br>,<span> pre:可以把代码进行原样渲染,span:通用的内联元素
  • <time>,<abbr>,<address>,<code> code:代码段,abbr:缩写

3.链接,列表与图像

  • <a>:链接
  • <ul><li>无序列表</li></ul>:无序列表
  • <ol><li>有序列表</li></ol>:有序列表
  • <dl><dt><dd></dd></dt></dl>:自定义列表
  • <img>:图像

4. 表格与框架

  • <table>+<tr>+<td> table:大容器,tr:行,td:列,单元格
  • theard:表头 表头里面的 td 要改成 th
  • tbody:表内容
  • cellspacing:单元格间距
  • cellpadding:单元格内文字与边框的距离
  • width:宽度,填写的数字默认就是像素
  • height:高度
  • align:排列的意思,表格是位置定义
  • colgroup:列的颜色设定
  • col:定义具体列的颜色
  • span:表格用到了内联元素
  • font-size:字体尺寸
  • margin-bottom:盒模型
  • rowspan:向下合并行
  • colspan:横向合并

5.表单

  • form:就是表单的意思
  • input:输入
  • lable:和 input 通过 id 绑定在一起
  • name:为的是提交数据库的时候的变量名
  • placeholder:提示信息
  • required:布尔值,必须填
  • autofous:自动落光标在上面
  • value:预定义的值
  • checked:布尔属性,出现即为真,默认选定
  • checkbox:复选框控件
  • hobby[]:复选框数组

ps:vscode 快捷键:按住 alt 键可多选!

6.感想:

第二天学习了,其实从事互联网行业也有五六年了,但是因为从事的是seo相关工作,因此,对代码只能是能看懂一点,碎片化学习,而且和程序员同事沟通有障碍,感觉鸡同鸭语,所以立志要学习代码,打通seo和程序编写的关系(就是老师说的全栈吧),这两天的感觉是,把自己多年的碎片化知识让朱老师都给串到一起,感觉非常爽,但是,还是新知识多,感觉自己的大脑像个海绵一样不断的吸呀吸,大脑好久没这么高速运转了,是朱老师说的那句闻道有先后,术业有专攻,熟能生巧激励着我,加油,继续努力!

7.作业

自己举例演示链接元素,列表元素,表格元素,表单元素的作业地址

声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议
移动用户-54358542020-04-04 22:20:531楼
加油,谢谢老师