美文网首页
HTML总结笔记(三)

HTML总结笔记(三)

作者: 此生唯一自传 | 来源:发表于2019-01-09 21:00 被阅读0次

一、列表

1.1 无序列表

无序列表,ul(unordered list),即列表中的每一项没有排名次序的。ul是一个组标签,内部只能有li标签。ul的作用是增加“无序列表”语义的。

列表项,li(list item),  不能单独存在,没有意义,必须包裹在组标签(ul/ol)里,li是一个容器级标签。

实际应用场景:导航栏、产品列表等。

1.2 有序列表

有序列表,ol(ordered list), 即列表中的内容有先后排名,使用方式同ul,但是实际使用场景不多,如果想要表达顺序 大家一般会用ul:

<ul>

        <li>1.王芳 100分</li>

        <li>2.李雷 98分</li>

        <li>3.小明 30分</li>

</ul>

1.3 定义列表

定义列表,dl(definition list)   每一个内容标题都有自己的专属描述。dl是一个组标签,内部存在两个子标签:

定义标题,dt(definition title)  

定义描述,dd(definition description)   用于描述dt标题的,一个dt可以搭配很多的dd

主要应用场景:

1.平台垂直菜单

京东-垂直菜单

2.部分平台底部平台信息列表


二、div 和 span

分割区域,div(division) ,容器级标签。  大家常说的“div+css”模式中的div即是此。div标签负责布局结构,css负责样式。

分割区域,span,文本级标签,  也就是说,span里面只能放置图片、文字、表单元素

三、表单

表单,form,用于收集用户信息,即一些输入框、选择框、下拉菜单的集合。

内部有两个属性: action:动作,这个表单将会提交到哪里。   method:提交方式(get/post)

 input表示“输入”,代表此控件为一个输入相关控件。

3.1 input的type属性决定input的类型,如:

text-文本框

password-密码框 

radio-单选按钮(一组单选按钮需要一个相同的name值,否则互斥无效)

checkbox-复选框(最好也要有相同的name)

3.2 下拉列表

 select标签,也是组标签,内部需要option选项标签支撑。

3.3 文本域

文本域,textarea,内部文字即为该文本域默认文字,其中有两个属性,cols(columns):列 rows:行

3.4 按钮

按钮有三种类型:普通按钮,提交按钮,重置按钮。

按钮也是input标签 的type属性决定,分别是:button\submit\reset

3.5 label

标签,用于关联内容,例如点击标题可以获取对应输入框的焦点等

<input type="checkbox" id="kk" /> <label for="kk">10天内免登陆</label> 

四、其他内容

4.1 注释

<!-- xxxx --> 为一个完整的注释。 sublime中快捷键:ctrl+/

4.2 字符实体

用于打印可能会被转义成标签的内容。例如打印<h1>,只需要打印 &lt;h1> 系统便不会识别错误

常用替代字符: 

&lt;  less than,小于。

&gt; greater than 大于。

&copy; 版权符号。

&nbsp; non-breaking spacing 空格

4.3 废弃标签

font:字体 

b:加粗

u:下划线

i:倾斜

del:删除线

em:强调

strong:强调

hr:水平线

br:换行

相关文章

  • HTML总结笔记(三)

    一、列表 1.1 无序列表 无序列表,ul(unordered list),即列表中的每一项没有排名次序的。ul是...

  • HTML笔记总结

    html总结 1.HTML 指的是超文本标记语言 (HyperTextMarkupLanguage)...

  • 《独角兽之路》读书笔记

    博客地址:http://caligo.cc 三节课 《独角兽之路》的读书笔记总结,直接在xmind导出的html,...

  • HTML笔记总结<1>

    这里总结 1.HTML的基本概念 2.meta元素 3.相对路径和绝对路径 4.anchor概念 参考网址:htt...

  • HTML笔记总结<2>

    这里总结 1.多媒体 2.iframe 3.高级文本格式 多媒体 video元素 iframe iframe是一种...

  • Html学习笔记总结

    做做笔记,防遗忘。 常见标签 html基本标签 文件标签:html、head、body排版标签:br、p、hr、《...

  • HTML总结笔记(一)

    一、网页的原理: 用户输入某个网址之后,对应的服务器发现用户请求该网页,就会将该网页相关的所有文件(图片文...

  • HTML总结笔记(二)

    一、h和p标签 h:标题,headline 到 都是标签:一级到六级标题 p:段落,paragrap。p标签...

  • HTML meta标签

    转载于HTML meta标签总结与属性使用介绍 - Lxxyx的开发笔记 - SegmentFault 思否

  • .html() .text() 和.val()的差异总结

    .html() .text() 和 .val() 的差异总结: .html().text().val() 三种方法...

网友评论

      本文标题:HTML总结笔记(三)

      本文链接:https://www.haomeiwen.com/subject/inxnrqtx.html