Home Article Practice 网页设计

网页设计

2024-12-08 17:07  views:112  source:小键人14892786    

二、CSS 必背1. 颜色与背景• color: 设置文本颜色。• background-color: 设置元
素背景颜色。• background-image: 设置元素背景图像。2. 字体• font-family:
设置字体类型。• font-size: 设置字体大小。• font-weight: 设置字体粗细。o 400:
正常粗细。o 700:加粗。• font-style: 设置字体样式。o normal: 正常字体。o ita
lic: 斜体。• line-height: 设置行高。3. 盒子模型• margin: 设置外边距。• pa
dding: 设置内边距。• border: 设置边框宽度、样式和颜色。o border-width: 设置边
框宽度。o border-style: 设置边框样式§ solid 实线、dashed 虚线、dotted 点
线。o border-color: 设置边框颜色。• box-sizing: 定义盒子模型的计算方式。o co
ntent-box: 宽度和高度只包括内容。o border-box: 宽度和高度包括内容、内边距和边框。4.
显示与布局• display: 定义元素的显示类型。o block: 块级元素。o inline: 行内元素
。o inline-block: 行内块级元素。o flex: 弹性盒子模型。• position: 设置元素
的位置属性。o static: 默认定位,不会偏移。o relative: 相对定位,依据原位置偏移。o ab
solute: 绝对定位,依据最近的定位祖先。o fixed: 固定定位,依据视口。• float: 设置元素
的浮动行为。• clear: 清除浮动。5. Flex 布局• flex-direction: 设置主轴方向。
o row: 主轴为水平方向,从左到右。o column: 主轴为垂直方向,从上到下。• justify-co
ntent: 设置主轴上的对齐方式。o flex-start: 靠左对齐。o flex-end: 靠右对齐。o
center: 居中对齐。o space-between: 均匀排列,空白间隔均分在盒子之间。o space
-around: 均匀排列,空白间隔均分在盒子两侧。o space-evenly: 均匀排列,空白间隔均分在盒
子和容器之间。• align-items: 设置交叉轴上的对齐方式。o flex-start: 顶部对齐。o
flex-end: 底部对齐。o center: 垂直居中。• flex-wrap: 设置是否换行。o now
rap: 不换行。o wrap: 换行。6. 其他常用属性• width: 设置元素宽度。• height:
设置元素高度。• overflow: 控制内容溢出时的处理方式。o hidden: 内容不可见,剪裁。o sc
roll: 始终显示滚动条。o auto: 根据需要显示滚动条。



Disclaimer: The above articles are added by users themselves and are only for typing and communication purposes. They do not represent the views of this website, and this website does not assume any legal responsibility. This statement is hereby made! If there is any infringement of your rights, please contact us promptly to delete it.

字符:    改为:
去打字就可以设置个性皮肤啦!(O ^ ~ ^ O)