我的账户
猩码学苑

专注C++开发菁英教育

亲爱的游客,欢迎!

已有账号,请

如尚未注册?

标题:冯文直-前端预科(5)-20221109

[复制链接]
。5962 发表于 2022-11-9 23:42:40 | 显示全部楼层 |阅读模式 打印 上一主题 下一主题
一、今日学习内容:
一、列表标签分类:1、无序列表(ul标签内包含li标签)列表项之间没有顺序级别关系,是并列关系<ul></ul>标签中只能包含<li></li>标签,直接在<ul></ul>标签中加入别的标签或者加入文字是不允许的<li></li>相当于一个容器,里面可以存放所有的元素无序列表带有自己的样式属性,实际应用中我们会将默认的属性用CSS清除掉2、有序列表(ol标签包含li标签)列表项有顺序之分<ol></ol>标签中只能包含<li></li>标签,直接在<ol></ol>标签中加入别的标签或者加入文字是不允许的<li></li>相当于一个容器,里面可以存放所有的元素有序列表带有自己的样式属性,实际应用中我们会将默认的属性用CSS清除掉3、自定义列表(dl标签中有dt和dd标签<dl></dl>标签中只能包含<dt></dt>和<dd></dd>标签一般一个<dl></dl>里面只包含一个<dt></dt>,一个<dt></dt>可以对应多个<dd></dd>二、表单标签使用原因:收集用户信息1、表单域一个包含了表单元素的区域,在HTML中用<form></form>定义,可以将用户提交的表单信息提交给服务器常用属性属性:action(用于指定接受并处理表单数据的服务器url地址),属性值:url地址属性:method(用于设置表单数据的提交方式),属性值:get/post属性:name(指定表单的名字,以区分同一个页面中的多个表单域),属性值:表单名称2、表单控件(表单元素)是允许用户在表单中输入或者选择内容的控件(元素)input表单元素type属性text:定义单行的输入字段,可以输入文本button:定义可点击的按钮checkbox:定义复选框radio:定义单选按钮(同一组单选按钮要有相同的name值)file:文件上传按钮password:密码字段,该输入框中的内容会被掩码(加密)reset:重置按钮submit:提交按钮其他属性name(定义input元素的名称),属性值:用户自定义文本value(规定input元素的值),属性值:用户自定义文本checked(规定input元素首次加载时应当被选中),属性值:checkedmaxlength(输入框最大字符长度),属性值:正整数1、name和value是每个表单元素都有的属性,主要给后台人员使用。2、checked按钮主要针对的是单选按钮和复选框,主要作用是打开页面后默认选择缪戈元素。3、name是给表单元素起名字的,一般要求一组单选按钮或者复选框的name值要相同。4、maxlength一般在表单中不常使用。3、label标签label标签用于绑定一个表单元素,当点击label标签内的文本时,浏览器会自动将焦点转到对应的表单元素上,增加用户体验label标签中的for属性对应的值要和相关元素的id属性对应的值相同4、select表单元素<select></select>中应至少包含一个<option></option>在<option></option>中定义一个select="select"时,可将当前的标签设置为默认选中项textarea表单元素当用户输入内容较多时,就不能再用文本框,需要使用文本域让用户输入,常见于留言板、评论区等三、CSS简介HTML的局限性:可做简单样式,但较为繁琐1、CSS是什么:CSS层叠样式表(Cascading Style Sheets),也是一种标记语言,不禁可以设置丰富的样式,也可以实现结构和样式分离2、CSS的语法规范CSS的规则是由选择器和声明块来组成的选择器是用于指定CSS样式的HTML标签,{}内部是对该对象时设置的样式多个属性之间用英文的分号;隔开属性和属性值之间用英文的冒号:隔开属性和属性值之间是以键值对的形式来书写的所有的样式一般都写在<table></table>标签中,一般该标签写在<head></head>标签中3、CSS的基础选择器1)标签(元素)选择器指用HTML标签名称座位选择器,按照标签名称进行分类,为页面中的某一类标签来指定样式优点:能快速将页面中同类型的标签统一设置样式缺点:不能设置有差异的样式,只能选中符合条件的所有同类标签2)类选择器语法:使用.来进行定义,使用class进行调用目的:为了差异化选择不同的标签,选择一个或多个标签都可以注意点类选择器使用.标识,后面要紧跟类名(类名是自定义的)如果类名较长,可以使用横线来将类名进行连接不要使用纯数字、中文等内容进行类的命名,尽量使用英文字母来表示命名一定要有意义,尽量使人一看就知道这个类代表什么意思多类名的使用使用方法:将样式里面的多个类名同时放在claa属性中进行调用即可,多个类名之间可用空格隔开有点:节省CSS代码,同意修改样式更加方便;给标签设置样式的时候比较自由,想调用哪几个类就调用哪几个类3)ID选择器ID是唯一标识,所以ID选择器主要是为了唯一的HTML标签指定的样式,虽然同一个id可以被调用多次,但是不允许这样使用。语法:在style标签中是用#来进行定义,在需要调用ID选择器的标签中用id属性进行调用ID选择器和类选择器的区别类选择器好比人的名字,一个人可以有多个名字,同时一个名字也可以被多个人使用同一个id选择器在一个页面中只允许调用一次id选择器经常和JS在一起进行搭配使用4)通配符选择器在CSS中,通配符选择器用*来进行定义,它表示选中页面中的所有元素注意点通配符选择器不需要进行调用,直接在style中声明即可只是特殊情况下才是用通配符选择器,比如:给所有的元素清楚本身所带的样式二、今日问题:无
三、解决方案:无
回复

使用道具 举报

关注0

粉丝0

帖子32

发布主题
大家都在学
课堂讨论
一周热帖排行最近7x24小时热帖
关注我们
专注C++菁英教育

客服电话:18009298968

客服时间:9:00-21:00

猩码学苑 - 专注C++开发菁英教育!( 陕ICP备2025058934号-1 )

版权所有 © 陕西菁英数字科技有限公司 2023-2026