Giter Club home page Giter Club logo

css-adv's Introduction

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

css-adv's People

Contributors

cloudai avatar cloudyan avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.