前端-标签样式表

/css 层叠样式表/（配合HTML文件调试网页内容的显示样式）
/*
选择器
1.ID选择器
2.类选择器
a.无须唯一
b.选择性使用
c.组合使用
3.标签选择器
4.{}（所有选择器响应）
*/
#name{…}

.name{…}
li{…}

• …

• /盒子模型/（将页面中不同的选项模块看作是不同大小的盒子在做嵌套 上图涂红部分可看作一个盒子然后可对其设置内容及格式）
  box-sizing:content-box（内容盒子，由内容大小自内而外做加法）/border-box（边框盒子，给定外部宽高自外而内做减法）
  /宽高/ width height :Npx
  /外边距/margin-top/right/bottom/left（兄弟同辈关系控制）(盒子基于上级父盒水平居中 )
  /内边距/padding-top/right/bottom/left(语法同margin)(子盒基于上级父盒关系控制)
  /边框/border:color width style(线型)
  /背景样式/background-color
  background-image:url(PATH)(浮于背景颜色之上)
  background-position:相对位置/绝对位置
  相对位置；
  横向：left center right
  垂直：top center bottom
  绝对位置；Xpx Ypx;
  background-repeat:no-repeat; 平铺
  background:color image position repeat
  background-size:cover;(图片填满窗口)

  /弹性盒子/inline/inline-block/block(单向修改)(不换行)
  /父盒样式/
  display:inline/inline-block/block/flex/none(隐藏);
  flex-direction:row/column;弹性变化方向
  flex-wrap:no-wrap;换行
  justify-content:space-betwwen/space-around(水平对齐)
  align-content:space-betwwen/space-around(垂直对齐 多行)
  align-items:space-betwwen/space-around(垂直对齐 单行)