断断续续大半个月总算看完了这本书,记录一下中间的心得和踩过的坑。
github 实例地址:
https://github.com/SuYaru/Pre/tree/master/Fenli08
实际效果
1、首页左侧最新动态
过去只是知道 appendTo 是向父节点添加子类节点的一种方式,这里竟然可以直接将子节点移动
2、详细页点击颜色切换图片以后,对于不能访问的情况
chrome 报错
Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
有说修改 chrome 目标属性的 ,几乎都是这种解决办法
https://blog.csdn.net/superit401/article/details/72772658
https://blog.csdn.net/okgoodyes/article/details/38383367
然而并没有用,因为编译器用的是 vscode,最后安装扩展 Live Server ,成功解决
https://blog.csdn.net/katecatecake/article/details/79045211
3、五角星的触发效果
每个五角星都是一个 a ,点击的时候触发 a 的效果
0)对初始化的每个a ,设置递增的 left 距离
1)根据 li 一列下来不同class 赋予不同的 hover 效果
2)点击后 给 ul 增加不同的类(向上缩进不同的距离)
3)ul 不同类的背景属性:background-position 0(== left ) 0(== top )
4、要记得<del>标签,同样有删除样式
detail 样式中没有设置 :text-decoration:line-through 。
5、还有就是,各种快速填充快捷键
切换下一行:shift + enter
删除当前行:ctrl+Y
当前行内容复制到下一行:ctrl+D
alt + shift + 鼠标左键:像 单按 alt 一样选中某一列
快速写ul:ul.menu>li*6>a[href=#]{内容} 按tab键
[属性:alt 属性一般不写,都自带有],{文本内容($从1开始自增填充)}
ul>li.item$@3*5:class从 item3 向后5个数
+ 并列标签 ^ 找父级
连续两个 .类1.类2 :同时增加多个类