css学习

字体：

1、样式继承：例如 font-size

2、字体风格：font-style 是否倾斜

3、字体粗细：font-weight

4、字之间的间隔：letter-spacing

5、首行缩进：text-indent

6、水平居中：text-align

7、行高：line-heigh

8、vertical-align：操作行内元素

行内元素：设置宽高不起作用。

如何子元素在父元素水平居中：如果子元素是快，可以使用margin:0 auto,如果是行内元素可以使用text-align:center

如何垂直居中：可以使用margin-top:需要计算出来

 

设置多列：设置宽度，column-width

 

 伸缩盒模型：flex

水平垂直居中：

 css练习:

设置图片圆角：

<html>
  <div class="syt1">
    <img src="https://t7.baidu.com/it/u=963301259,1982396977&fm=193&f=GIF"/>
  </div>
</html>
.syt1 img{

 border-radius: 50%;

width:30px;

height: 30px;
}

 首行缩进：给父元素设置：text-indent:50px

 flex居中显示：

    .syt1 {

display:flex;
 justify-content:center
  
}

 

改变方向：flex-direction:row-reverse4

在线测试地址：https://c.runoob.com/front-end/61/

posted @ 2023-09-04 23:04  刘百会  阅读(20)  评论(0)    收藏  举报