前端知识
包括HTML5、css、js等前端技术,适合初学者阅读
let&var
在职大学生
展开
-
编码过程中遇到的前端界面问题
input输入框的placeholder属性这个属性在IE浏览器中是不受支持的,因为这是h5新增的属性,而IE浏览器兼容模式下不支持,导致文本框中默认提示信息不显示; IE不支持const定义的变量 在js中,定义变量会用到var、let、const,但是在IE中const定义的属性会出现“语法错误”的提示信息,且界面展示也有问题;改为var即可 ...原创 2021-12-14 12:03:41 · 911 阅读 · 0 评论 -
css实现文本框中内容超出长度显示省略号,鼠标移入悬浮显示全部内容
实现文本超长以省略号的形式隐藏文本,达到不影响其他元素布局的效果;包括多行和单行文本的省略显示,以及应用此功能时,需要注意的属性之间冲突。原创 2021-12-14 11:55:25 · 40086 阅读 · 4 评论 -
HTML之select下拉框:默认值设置
当我们做web项目时,总是会碰到的一种情况是下拉框的使用,提交数据很简单,但是数据的回显就会遇到一些问题:我们在数据回显时,期望下拉框默认显示的是这条数据选择的选项。举个例子:有一篇博文,我上传时设置的博文分类是:原创;但是分类有:原创、转载等;下拉框默认显示的应该是:请选择;数据回显时期望显示的是:原创;其实这个问题很简单,就是默认显示谁的问题。如果我们什么都不设置,默认显示的是c:for遍历出来的第一个数据。如果设置默认值的话,selected属性就可以帮我们实现:原创 2021-01-21 16:15:07 · 9365 阅读 · 0 评论 -
关于JavaScript的函数中重复调用同一个Id选择器问题
不管是JavaScript还是jQuery中,基本选择器的种类只有id选择器、name选择器、class选择器、标签选择器几种,调用语法无非是id前加#、class前加.、直接写标签名等;我们通常的用法都只是一个id选择器对应一个方法或事件,实际上也就是同一个id选择器只使用一次;因为id属性的唯一性,也就导致了id选择器的理论上唯一性,但并非真的唯一。实际开发中,同一个id选择器使用多次的情况不在少数,有些IDE就会对这种使用方法产生黄色警告问题。意思就是:jQuery选择器出现多次;因为原创 2020-12-29 09:38:05 · 1310 阅读 · 0 评论 -
关于H5的新特性placeholder,在文本框内给出提示信息,获得焦点时消失,使用时IDEA给出黄色警告问题
placeholder属性的作用:可以在文本框内给出用户提示信息,当点击文本框获得焦点时,提示信息消失;<input type="text" name="userName" placeholder="请输入用户名" />出现黄色警告的原因首先要知道placeholder属性是HTML5新增的属性,在以前的版本是不支持此属性的,所以会出现如下警告:具体警告内容就是:标签placeholder不允许在这里;实际上的意思就是不允许在这里使用,要么是使用的位置不对,要么是不支持原创 2020-12-28 16:37:51 · 909 阅读 · 0 评论 -
关于JavaScript中的比较前后两个值IDEA出现黄色警告:比较这两个值可能会导致意料之外的类型转换
先说一下黄色警告的问题:大体意思就是:比较这两个值可能会导致意料之外的类型转换。产生的问题:那我们就很纠结了:为什么会导致意料之外的类型转换?哪来的类型转换?比较这两个值相不相等不就完事了吗?解决步骤:解决这一类问题最好的方法是追根溯源,即去找JavaScript的语法基础知识。第一步、先来看一下JavaScript中关于判断两个值是否相等的语法:==两个等于号,等于运算符, 也叫非严格相等比较, 又名宽松相等比较 ===三个等于号,恒等于运算符, 也叫严格相等比较...原创 2020-12-28 14:13:27 · 3653 阅读 · 0 评论 -
IE与其他浏览器关于小数点px的差异
写在前面的唠叨说到解决兼容性问题,不得不提一下css hack,曾几何时我以会使用几个hack沾沾自喜,后来发现自己真是个vip级别的蠢蛋,会用几个hack只是中级阶段,真正厉害的人要以没有hack同样可以实现复杂页面的兼容性,这才叫厉害。所以后来,苦心研究如何无hack实现各个浏览器兼容性俱佳,最核心的就是布局方式,宜采用流动性布局,亦称自适应布局,我自己总结为三无原则:无浮动,无高度,无宽度。神似于武侠里的无招胜有招,忘记招式才是最高境界一样的道理。好,这个内容很大,洋洋洒洒几万字都说不尽,作罢。我转载 2020-12-25 15:45:01 · 655 阅读 · 0 评论 -
使用label标签实现点击文字相应文本框获取焦点
目录使用label标签实现点击文字相应文本框获取焦点应用实例具体用法label标签的定义:label标签的作用:代码示例简要文字说明:使用label标签实现点击文字相应文本框获取焦点点击文字,就可以选中单选框或者复选框,亦或者是对应的文本框。应用实例在性别的选择上,对于单选框的选择只有很小一块区域,操作起来不是很方便,为了解决这个问题就可以使用label标签。具体用法label标签的定义:<label>用于为输入控件定义文本标签(label原创 2020-12-23 17:00:17 · 1808 阅读 · 0 评论 -
html中修改超链接a标签的样式
修改a标签的默认样式正常的超链接写法,未加任何自定义css样式:<a href="#">超链接</a>点击链接之前的样式:点击链接之后的样式:此时有一个需求:添加css样式,达到如下目的:设置字体颜色为黑色 去掉点击链接以后的下划线 设置字体大小为xx-large此时需求代码实现如下:<a href="#" id="test">超链接</a><style> #test{ color:..原创 2020-11-15 20:30:27 · 7200 阅读 · 2 评论 -
使用js实现导航窗格在页面下拉以后固定在页面顶端
使用js实现导航窗格在页面下拉以后固定在页面顶端。bootstrap中的组件可以实现导航栏固定在页面的最顶端,但是有些时候导航栏并不是在页面最顶端显示的,此时bootstrap组件就不适用了。经过多次测试,最终得到了这种简便方法,留存下来以便不时之需,也可以适时拿出来显摆一下,哈哈哈。。。话不多说,直接上代码:首先是HTML部分,当然要留出来第一个div,用来放一些标题之类的内容,随后就是导航栏,此处的container是bootstrap的栅格布局,懂的人自然懂,不懂也没关系,containe原创 2020-09-28 18:00:00 · 2458 阅读 · 0 评论 -
简洁说明如何实现最外层div盒子在界面中居中显示
页面中最外层的div居中显示首先写一个div,加一些样式让div显示出来;<div class="body_div" style="border: 1px solid red;"> 让div居中显示</div>此时的界面显示的div是占满整个浏览器页面的,为了显示出居中效果,可以加一下width、height:width: 500px;height: 150px;此时页面是这个样子的:接下来就是中心任务,让div在页面中居中显示。只需要加一句话就全部原创 2020-09-28 14:22:04 · 1324 阅读 · 0 评论