欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

html、css、响应式

程序员文章站 2024-01-29 19:36:40
...

HTML:标签语言
常用的标签:标题标签h1-h6/段落标签p/div//>i/o/b/li/a/表单标签(form input) ,自定义标签

Css:决定样式,重叠样式表
标签的大小(外边距margin/内边距padding/边框border/内容的宽width高height)
盒子模型大小: box-sizing:border-box(设定的 width 和height涵盖padding和border)/content-box;
元素的背景: background: 颜色/背景图片
背最颜色: background-color
背景图片: background-image
背最图尺寸: background-size
背景图片位置: background-position
背最是否重复: background-repeat
文字字体: font-family
文字尺寸: font-size
文字粗细: font-weight
文字颜色: color
文字排版: text-align
文字行高: line-height
文字阴影: text-shadow
浮动布局:向左向右浮动,缺点(父元素高度塌陷),伪元素清除浮动
弹性布局:弹性容器,弹性子元素,主轴,侧轴,主轴分布,侧轴分布,剩余空间,子元素
顺序,弹性换行
过渡动画: transition: 过渡属性过渡动画的时间过渡延迟时间过渡变化的速度
动画: animation:动画的名称动画的时间动画的延迟时间动画的速度动画方向动画的次数

响应式
视窗的设定viewport
1/设定移动端设备他的分辨率为它默认的系统分辨率(最佳分辨率)

<meta name="viewport"  content=" width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,uer-scalable=
no" />

2/设定移动端设备的分辨率为固定设计稿的分辨率(当物理分辨率小于设计稿的分辨率时会失真)

<meta name="viewport" content="width=375,user-scalable=no" />