Skip to content

Latest commit

 

History

History
45 lines (35 loc) · 1.19 KB

README.md

File metadata and controls

45 lines (35 loc) · 1.19 KB

css-adv 前端能力提升练习

html/css布局实现技巧练习

css 练习布局命名由css-前缀开头

  • 图片hover,1px公用边
  • 不对称的全宽背景平铺
  • 两列的经典布局(实现其中一列自适应?再优先加载?两列等高?)
  • 简单的tab切换,要压住下边线哦
  • 左小图,右自适应宽度的布局,小三角箭头的应用
  • 箭头以及垂直排列
  • tag标签,注意文字垂直居中,标签要水平对齐
  • 表格布局小应用,如何变得更精美
  • 复杂的下单列表
  • 筛选排序功能
  • 筛选价格功能
  • 筛选项布局
  • 产品列表
  • tab切换变体,这个布局有些技巧
  • 纯css实现半透明滑动板,两侧有滑道哦
  • 这个布局点击横向滚动内容,每次4格但不超过最后一格以及垂直的滚动悬浮
  • 文本两端对齐
  • 文本垂直对齐
  • 实现步骤条(纯css)
  • header标题居中
  • 选色器
  • 模拟键盘

JS 实现练习

  • 正则过滤练习

Git 分支操作

//关联远程分支
$ cd your_repo_root/repo_name
$ git fetch origin
$ git checkout gh-pages

//推送分支到远程
git push --set-upstream origin gh-pages