文本属性,字体样式,盒子模型

1.字体

　　body {

　　　　/*字体*/

　　　　 font-family: "Microsoft Yahei";

　　　　/*字体大小*/

　　　　 font-size: 20px;

　　　　/*字体粗细 bold加粗 bolder更粗 lighter更细 400是默认 700等于加粗*/

　　 　　font-weight: 400;

　　　　/*字体样式normal正常 italic斜体*/

　　　　font-style: italic; 

　　　　/*字体颜色*/

　　 　　color: #000;

　　　　}

　　/*引入外部字体*/

　　@font-face {

 　　   　　font-family: zidingyi; font-family的值是自定义的 然后再用font-family: zidingyi;调用

 　　   　　src: url(./Americratika.ttf);

　　　　}

　　.aa{

   　　   font-family: iconfont;

 　　 }

2.文本属性

　　divc {

    　　/*文本属性*/

    　　/* 文本首行缩进 */

    　　text-indent: 20px;

   　　 /* 文本对其方式 */

    　　text-align:center;

    　　/*下划线 删除线 顶划线*/

   　　text-decoration: underline line-through overline;

    　　/* height: 100px;*/

   　　 width: 100px; 

    　　/* 高度固定后，和height值相同可以设置垂直居中 */

    　　line-height: 100px; 

   　　 /* word-break: break-all; */

    　　/*超出宽度自动换行*/

    　　/*文本不换行,三个属性同时用会出现省略号*/

   　　 white-space: nowrap; 

    　　overflow: hidden;

    　　/* 文本超出显示省略号 */

    　　text-overflow: ellipsis;

    　　}

3.盒子模型

　　盒子模型是加在块级元素 当两个盒子垂直相遇时可以把上盒子模型外边框的下边框宽加到内边框上,或者给盒子加个div设置一个 border-bottom: 1px就是下边框

　　.cc{

    　　width: 100px;

   　　 height: 100px;

   　　margin: 10px 20px 0px 40px;

    　　padding: 40px 30px 40px 10px;

   　　 border: 1px dotted red;

　　}