CSS3
CSS3
不变胖绝不罢休
这个作者很懒,什么都没留下…
展开
-
6、定位-
6、定位6.1、相对定位相对定位:position: relative;相对于原来的位置,进行指定的偏移,相对定位的话,它仍然在标准文档流中!原来的位置会被保留top:-20px;/*向上偏移20px*/left:20px;/*向右偏移20px*/bottom:10px;/*向上偏移10px*/right:20px;/*向左偏移20px*/<!DOCTYPE html><html lang="en"><head> <meta原创 2022-05-19 14:19:15 · 83 阅读 · 0 评论 -
5、浮动(重难点)
5、浮动5.1、标准文档流块级元素:独占一行 h1~h6、p、div、列表行内元素:不独占一行 span、a、img、strong注:行内元素可以包含在块内元素中,反之则不可以5.2、display(重要)1.block:块元素2.inline:行内元素3.inline-block:是块元素,但是可以内联,在一行!4.none:消失这也是一种实现行内元素排列的方式,但我们很多情况用float<!DOCTYPE html><html lang=原创 2022-05-19 14:16:01 · 98 阅读 · 0 评论 -
4、盒子模型
4.1、什么是盒子模型1.margin:外边框2.padding:内边框3.border:边框4.2、边框border:粗细 样式 颜色1.边框的粗细2.边框的样式3.边框的颜色4.3、外边距----妙用:居中margin-left/right/top/bottom--->表示四周,可分别设置,也可以同时设置margin:0 0 0 0/*分别表示上、右、下、左;从上开始顺时针*//*例1:居中*/margin:0 auto /*auto表示左右自原创 2022-05-19 14:14:11 · 99 阅读 · 0 评论 -
3、美化网页元素
3、美化网页元素3.1、为什么要美化网页1.有效的传递页面信息2.美化页面,页面漂亮才能吸引客户3.凸显页面的主题4.提高用户的体验**span标签:**重点要突出的字,使用span标签套起来<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Span</title></head><.原创 2022-05-18 17:30:58 · 379 阅读 · 0 评论 -
2、快速入门
1、什么是CSS1.1、什么是CSSCascadinig Style Sheet 层叠样式表CSS:表现(美化页面)字体、颜色、边距、高度、宽度、背景图片、网页定位、网页浮动1.2、发展历史CSS1.0CSS2.0:DIV(块)+CSS,HTML与CSS结构分离的思想,网页变得简单,SEO、CSS2.1:浮动、定位CSS3.0:圆角、阴影、动画、浏览器兼容性2、快速入门2.1.1、练习格式:<!DOCTYPE html><html lan原创 2022-05-18 17:28:00 · 106 阅读 · 0 评论 -
1、什么是CSS
前言1.css是什么2.CSS怎么用(快速入门)3.CSS选择器(重点+难点)4.美化页面(文字、阴影、超链接、列表、渐变...)5.盒子模型6.浮动7.定位8.网页动画(特效)1、什么是CSS1.1、什么是CSSCascadinig Style Sheet 层叠样式表CSS:表现(美化页面)字体、颜色、边距、高度、宽度、背景图片、网页定位、网页浮动1.2、发展历史CSS1.0CSS2.0:DIV(块)+CSS,HTML与CSS结构分离的思想,原创 2022-05-18 17:23:49 · 79 阅读 · 0 评论