慕课网

精品课程初识HTML(5)+CSS(3)

初识HTML(5)+CSS(3)

最热最新

huir_

块级元素水平居中（在有宽度的情况下，使用外边距来居中）：
使用margin：20px auto来实现水平居中，auto固定，上下可改
margin-left:auto;（√）
margin-right:auto;（√）

查看全部

0 采集收起来源：水平居中设置-定宽块状元素

2021-02-02

huir_

块级元素水平居中
如果是设置块级元素中的文本、图片等，可以给父元素设置text-align：center；让文本图片基于父元素居中

查看全部

0 采集收起来源：水平居中设置-行内元素

2021-02-02

huir_

flex：1/2/3....
1.给子元素设置flex属性，可以设置子元素相对于父元素的占比
2.flex的值只能是正整数
3.给子元素设置了flex之后，其宽度属性会失效

查看全部

0 采集收起来源：我想占大头 - 给子元素设置flex占比

2021-02-02

huir_

align-items属性设置纵排列方式
flex-start左对齐
flex-end交叉轴的终点对齐
center中点（中间）对齐
baseline第一行文字的基线对齐（底部）
stretch默认

查看全部

0 采集收起来源：操作一下竖轴- 使用align-items属性设置纵轴排列方式

2021-02-02

huir_

justify-content设置横排列的方式
flex-start交叉轴的起点对齐
flex-end右对齐
center居中
space-between两端对齐，元素之间的间隔相等
space-around两侧的间隔相等，元素之间的间隔相等

查看全部

1 采集收起来源：操作一下横轴- 使用justify-content属性设置横轴排列方式

2021-02-02

huir_

设置display：flex可以把块级元素在一排显示
1.需要添加在父级元素上，来改变子元素的排列顺序
2.默认是从做往右依次排序并且没有间隙

查看全部

0 采集收起来源：弹性盒模型 - 弹性盒模型之flex属性

2021-02-02

huir_

relative和absolute结合使用：
1.参照定位的元素必须是相对定位元素的前辈元素
2.参照定位的元素必须加上position：relative
3.需要定位的元素加入position：absolute，并且使用top，bottom，left，right来进行定位

查看全部

0 采集收起来源：Relative与Absolute组合使用

2021-02-02

huir_

fixed固定定位，类似于absolute；
但是fixed相对移动的坐标是视图（屏幕内的网页窗口）；
由于视图是固定的，因此fixed定位的元素，不会随着浏览器窗口的滚动，而改变位置。

查看全部

0 采集收起来源：我就在那不动了-层模型之固定定位

2021-02-02

huir_
```
position:relative 相对定位
一般情况下父元素相对定位，子元素绝对定位
```
查看全部

0 采集收起来源：相对于自己的位置-层模型之相对定位
2021-02-02

huir_

position：absolute 绝对定位
将元素从文档流中拖出来，
用left，right，bottom，top属性，
相对于其最接近的一个具有定位属性的父元素进行绝对定位，
没有父元素的时候，则相对于body元素

查看全部

0 采集收起来源：万事无绝对 -层模型之绝对定位

2021-02-02

huir_

浮动模型：
如果想要两个块级元素都并排显示，可以用浮动来实现
float：left/right

查看全部

0 采集收起来源：起飞咯 - 浮动模型

2021-02-02

BurstLink
根据文中例子以及多次测试得出以下结论，供学习者参考并且希望大佬指出我理解中的错误之处。
flex属性具备以下特点：
1. 设置 display:flex 属性，可以让所有子级元素在同一行中显示。
2. flex需要添加在父级元素上，改变子级元素的排列方式。
3. flex属性默认为靠父级元素顶部并从左往右依次排列，并且子级元素和父级元素没有间隙。
4. 一般情况下，子级元素的宽度会随着父级元素宽度的改变而改变，部分标签除外：如<img>标签，图片的最小宽度不会随着父级元素的宽度改变而改变。
5. 一般情况下，多个子级元素若宽度不同，父级元素的宽度改变时，子级元素也会按各自宽度的比例去改变，部分标签除外，如<img>标签，图片的最小宽度不会随着父级元素宽度的改变而改变。
6. 若子级元素高度大于父级元素的高度，那么子级元素就会超出父级元素的显示范围。
7. 若父级元素没有定义高度，那么父级元素的高度会以高度最高的子级元素为准。
8. 若有子级元素没有定义高度，那么没定义高度的子级元素就会默认与父级元素的高度相同。若此时父级元素没有定义高度，那就参考第7条。
9. flex属性仅应用于该元素的直接后代，不会应用于多级后代元素。
10. 使用flex属性后，其内包含的直接后代元素，哪怕是行内元素，也会具有块状元素的特点，支持设置高度和宽度以及上下左右的边距。
查看全部

0 采集收起来源：弹性盒模型 - 弹性盒模型之flex属性
2021-02-01
慕的地6118176

行间距line-height

查看全部

0 采集收起来源：太挤啦,撑开一点 - 使用line-height为文字设置行间间距
2021-02-01
慕的地6118176
首行缩进：text-indent
```
p{text-indent:2em;}
注意：2em的意思就是文字的2倍大小。
```
查看全部

0 采集收起来源：开头空两格喔 - 使用text-indent为文本添加首行缩进
2021-02-01
慕的地6118176

text-decoration可以设置添加到文本的修饰。
1.underline为定义文本下的一条线
2.overline为定义文本上的一条线
3,line-through为定义穿过文本下的一条线，一般用于商品折扣价

查看全部

0 采集收起来源：给文本装饰一下 - 使用text-decoration添加文本修饰
2021-02-01

首页上一页 322 323 324 325 326 327 328 下一页尾页

0/150

提交

取消

开始学习

课程须知: 没有任何WEB经验的WEB应用程序开发者、对WEB前端技术感兴趣的用户均可学习本教程。

老师告诉你能学到什么？: 本教程代领大家轻松学习HTML(5)、CSS(3)样式基础知识，可以利用HTML(5)、CSS(3)样式技术制作出简单页面。