css
文章平均质量分 77
十假杰出青年
这个作者很懒,什么都没留下…
展开
-
javascript实现todolist(基于本地存储)
点击单选框,实现切换任务的完成与未完成状态(未完成在上方,已完成在下方)todolist可以实现点击上方输入框添加任务。任务上方数字显示未完成任务和已完成任务的数量。点击清除任务,会清除任务以及本地存储中的数据。点击计时器,实现倒计时效果。原创 2022-11-04 10:14:25 · 547 阅读 · 0 评论 -
js使用localStorage存储todolist
1 实现点击input输入框添加任务首先获取元素并创建本地存储ls然后为button添加点击事件(这是为button添加阻止默认操作,因为button在form里面,会自动提交刷新页面。其实为input添加type="button"也可以实现同种效果。)整体思路就是1 先判断input是否输入为空,若为空就弹出提示框,否则就继续执行操作。2 清空每次输入input后的值3 创建一个li标签,用来做新任务4 把input输入的值inputValue添加到新建li标签中5 把原创 2022-06-25 19:40:54 · 428 阅读 · 0 评论 -
css阶段总结
学习css也有了一段时间,总的来说,还算是小有所获吧。个人觉得css主要还是网页整体布局的应用,而html则是网页的内部结构。虽然css也能不依靠js实现一些特效,但总感觉略显生硬,不过也能实现。以下是我学css的个人总结,有在网上找的,感觉比较重要的知识点,也有我自己的总结。如有不对之处,还望评论区指正。网页结构 CSS命名头 header内容 content/container页面主体 main尾 footer导航 nav侧栏 sidebar栏目 column页面外围控制整体原创 2022-06-14 11:20:28 · 195 阅读 · 2 评论 -
【让盒子垂直水平居中】
首先,创建两个盒子,box盒子在div盒子面盒子样式如图先用display:inline-block将子盒子转换为行内块,然后用文本水平居中和行高让box盒子水平垂直居中。由于对齐方式的不同,给box盒子添加vertical-align: middle;方式二利用绝对定位和外边距来实现先为父盒子设置相对定位,再为子盒子设置绝对定位,且绝对定位的四个方向的值都为0,然后将外边距margin设为auto。...原创 2022-06-12 10:54:55 · 155 阅读 · 0 评论 -
【绝对定位和float的区别】
就是按照上下左右的顺序一行一行排列的,长度不够就会自动挤到下一行。代码如下非文档流:顾名思义就是脱离普通流的,在普通流上面是不占据位置的。css有position的样式,position包括:static,relative,absolute,fixed四种值。其中static是属于普通流;relative也是属于特殊的普通流,详细下面有介绍;absolute和fixed以及float就是属于非普通流的,加载的时候,也会顺序加载,但是会脱离普通流的位置。代码如下CSS中脱离文档流,也就是将元素从普通的转载 2022-06-07 17:00:10 · 168 阅读 · 0 评论 -
【absolute和Z-index对层级关系的影响】
有时候我们使用absolute绝对定位和z-index,来调整元素的位置与层级关系,可总是遇到一些出乎我们意料的状况,不知道大家有没有碰到和我一样的问题。话不多说,上代码这种情况下每一层都遵循 HTML 定位规则,其中的 left,right,top,bottom 定位信息对其无效,z-index 也不会发挥作用因为没有层叠的情况出现.如两个绝对定位对象的 z-index 属性具有同样的值,那么将依据它们在HTML文档中声明的顺序层叠.这种情况下,依据它们在HTML文档中声明的顺序层叠,因为 z-index转载 2022-06-07 08:57:08 · 745 阅读 · 0 评论 -
解决父元素塌陷问题
我们期望的的结果实际结果通过结果我们不难发现,box1和box2同为块级元素,按标准文档流来,box2应该另起一行位于box1的下面一行,也就是位于子元素1和子元素2的下面。他们本来不应该有重叠的部分,但是box1和box2却跑到了子元素1和子元素所在区域的下面。造成这种状况的原因是父元素未设置高度,再加上子元素浮动导致父元素box1高度塌陷,父元素的高度无法把子元素包括在内。此时父元素高度为0,因为父元素未设置高度。这也导致box2仍然在box1高度为0的下面继续按标准文档流来布局,所以他们有了我们不期望原创 2022-06-06 21:20:36 · 2266 阅读 · 0 评论