web前端课堂小结

课堂小结
我们主要以京东首页为案例,进行了讲解。主要有以下知识点:

  1. 用icon时习惯用标签
  2. 网页布局主要分为固定居中布局、流动式布局、弹性布局
    固定居中布局指网站内容被一个固定宽度的容器包裹,容器内的区块都有固 定的百分比或者像素宽度值,最为重要的是容器不能移动。
    流动式布局其实现方法是大多数组件(包括主容器)都设置成百分比的宽度,并且根据用户的屏幕分辨率自适应。
    弹性布局使用单位em来定义元素的宽度。下边的引言介绍了em”电脑屏幕上的‘像素’是一个不可缩放的点,而em则是相对于字体大小的单位宽度。它随着字体大小的变化而变化,反应用户对字体大小的设定“——Patrick Griffiths,A List Apart
  3. background-image的定义和用法
    background-image属性为元素设置背景图像
    background-size 设置背景图片大小
    background-repead:no repead 图片不平铺
  4. box-shadow的定义及用法
    box-shadow属性向框添加一个或多个阴影
    例:box-shadow:3px 2px 1px silver;3px为沿x轴正方向的长度,2px为沿y轴正方向的长度,1px为阴影的扩散范围,silver为阴影的颜色。
  5. input标签
    一个简单的HTML表单,包含两个文本框和一个输入按钮。
    常用的属性有 button(按钮)、checkbox(复选框)、password(密码框)radio(单选框)、text(单行文本框)、place holder(输入框的提示信息)
  6. border-radius给div元素添加圆角的边框
    border-radius:50%为圆形
  7. cursor:pointer 鼠标移动上去默认小手

你可能感兴趣的:(web前端课堂小结)