2022-02-17——练习静态页面day2(锚点)

啊啊啊啊啊啊啊啊啊啊啊啊啊啊hover!!!!!!!!!!摆烂了,我学nm!!!!!!!!!!!!!



麻了,9个页面,人已经麻了。

先说一下今天的收获

1.背景色渐变的应用background-image(linear-gradient()

这个东西会和背景图片重叠,好像是可以插入两张图的,但我一直是后面的图覆盖前面的图,待改日研究

2.关于自定义列表与hover的搭配

不明白,为什么td不能设置hover的响应。然后是ul li的应用中,如果在li中放入新的ul,内容会被外层的ul挡住,且无法自动向下排列,只有在外层设置ul的长度,才能完整显示li中的新ul。但问题来了,这样要如何隐藏次级ul的内容呢?我直接疑惑。于是这里我想到了新的方法,就是用自定义标签,用dl,dt,dd这样就能完整显示。然后,这里特码竟然还有个问题,就是dt标签无法设置:hover [element]  我就不能理解了?为什么???这里就只能使用多个dl,来分别装入隐藏列表,这跟div是没有区别的,这里我直接人晕了。待改日研究

3.利用锚点实现鼠标点击后显示display:none的区域

千呼万唤使出来!只能说锚爹救我!先写用法:

给隐藏的盒子添加id属性,然后为作为目标点击的元素外面嵌套一层a,然后用a href"#id":这样去指向对应id的盒子,然后在style中添加响应方式#id:target{display: block;}

这是我目前没有学习js唯一的响应方式,按理说visited应该也可以,但我怎么都显示不了,总之还是懵逼。

昨天一个页面,今天勉强算三个,中间穿插布局练习,还可以吧。。


晚上21.15,惭愧惭愧,看了半天才明白border-image的用法。。真的蚌埠住了,详情记载随笔属性中。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 本文主要讲述页面布局样式方面涉及的知识点,更全面的对CSS相应的技术进行归类、整理、说明,没有特别详细的技术要点说...
    Joel_zh阅读 4,569评论 0 1
  • 第1章 html基本结构 认识HTML: html不是一种编程语言,是一种标志语言 标记语言是由一套标识标签组成的...
    不喝可乐_7889阅读 3,902评论 0 0
  • 一、HTML和CSS 1. 你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么? IE: trident内核...
    Virtual66阅读 4,077评论 0 0
  • 转载请声明 原文链接地址 关注公众号获取更多资讯 第一部分 HTML 第一章 职业规划和前景 职业方向规划定位...
    前端进阶之旅阅读 16,685评论 32 459
  • 一、网页认识 1、网页组成 文字、图片、超链接、音频、视频; 2、网页背后本质 前端程序员写的一行行的代码; 3、...
    Cargo阅读 3,604评论 0 0