小奶狗给小喵咪上CSS课程
小奶狗给小喵咪上CSS课程
-
小奶狗,你好啊?
-
小喵咪你好~
-
听说学习HTML,要学习CSS是吗?
-
是的,小甜心~
-
那么CSS是什么呢?
-
CSS是Cascading Style Sheet英文的缩写,中文中的意思是层叠样式表,是用来控制网页的样式的,是一种可以与网页结构分离的一种标记型语言哦~
-
噢,那简单说就是CSS可以让HTML网页设计变得美化?
-
嗯,没错,css可以使得字体,颜色,背景等呈现不同的样式~
-
那小宝贝可以讲讲css发展历史吗,我想知道?
-
嗯,ccs的出现是为了满足网页设计的需求,也是历史发展的必须下产生的,1994年初,哈坤·利提出了 CSS的最初建议,在年底,会议上提出css的建议,1995年再提出,然后建立了w3c组织成立了,这个项目的负责人是哈坤、波斯~
-
小宝贝,那么什么是W3C呢?
-
W3C是World Wide Web Consortium的缩写,中文意思是“万维网联盟”,是一个Web标准化组织,是它制定了Web的技术标准~
-
嗯嗯?
-
1996年底,css成立,同年12月份,正式出版css,接着漫长的岁月中,不断变革,css成为网站需求的必备技术~
-
嗯,我说一下,1996年W3C组织成立,推出css1.0,1998年推出css2.0~
-
嗯,如今网页标准化,css技术成为网站的基本要求~
-
额,小宝贝,一直讲到Web标准,那么什么是网站标准呢?
-
Web标准是网页的标准,其标准是由W3C负责的,狭义的 Web 标准是指网页设计的 DIV+CSS 化,广义的是指要符合W3C和ECMA规范哦~
-
嗯?
-
在标准的网页设计中,网页前端设计必备基本语言为CSS,HTML,JavaScript~
-
CSS,HTML,JavaScript?
-
嗯,HTML负责网页的结构,css负责设计网页的表现,JavaScript负责网页的交互效果
-
小宝贝,那css样式可以教我一下吗?
-
样式是css最小的语法单元,css样式基本结构由选择器,样式包围符(开始),声明,延时包围符(结束)~
-
选择器,声明?
-
嗯,选择器告诉浏览器该样式将作用于页面的哪些对象,声明包含属性和属性值~
-
声明包括:属性和属性值?
-
属性名由一个单词或多个单词组成,多个单词之间通过连字符相连,属性值用来显示效果的参数~
-
你能多讲点吗?
-
哦,盒子模型,包括外边框,边框,内边距,宽,高等,margin,border,padding,height,width,background~
-
它们是否可分?
-
嗯,margin-top,margin-right,margin-bottom,margin-left; padding-top,padding-right,padding-bottom,padding-left,padding~
-
嗯,好了,我懂了,我会去了解的,那么讲讲单位?
-
嗯,讲讲绝对单位,英寸(in):是使用最广泛的长度单位,厘米(cm):生活中最常用的长度单位,毫米(mm):在研究领域使用广泛,磅(pt):在印刷领域使用广泛,也称点~
-
是不是也有相对单位?
-
是的,相对单位与绝对单位相比显示大小不是固定的,会受到屏幕分辨率,等各种因素影响~
-
那么相对单位也有一些单位,需要了解的吧?
-
是的,有em,它是表示元素的字体高度,(line-height: 2em),ex,它是根据所使用的字体中小写字母x的高度作为参考的,px是根据屏幕像素点来决定的~
-
额,懂,听说要了解一下css的优先级样式?
-
嗯,一般是标签选择器为1,伪元素和对象选择器为1,类选择器为10,属性选择器为10,ID选择器为100等~
结言
好了,欢迎在留言区留言,与大家分享你的经验和心得。
感谢你学习今天的内容,如果你觉得这篇文章对你有帮助的话,也欢迎把它分享给更多的朋友,感谢。
作者简介
达叔,理工男,简书作者&全栈工程师,感性理性兼备的写作者,个人独立开发者,我相信你也可以!阅读他的文章,会上瘾!,帮你成为更好的自己。长按下方二维码可关注,欢迎分享,置顶尤佳。
相关文章
- Do you really know CSS linear-gradients?
- vue—你必须知道的 js数据类型 前端学习 CSS 居中 事件委托和this 让js调试更简单—console AMD && CMD 模式识别课程笔记(一) web攻击 web安全之XSS JSONP && CORS css 定位 react小结
- 谈谈一些有趣的CSS题目(十六)-- 奇妙的 background-clip: text
- 【Css】css中class之间>(大于号)、~(波浪号)、 (空格)、,(逗号)、+(加号)详解(转载,笔记用)
- jquery控制CSS样式,并且取消Css样式(如背景色,有实例)
- 3天学会css视频_PHP初级 CSS教程_CSS入门教程
- 《HTML CSS JavaScript 网页制作从入门到精通 第3版》—— 2.9 练习题
- 《HTML与CSS入门经典(第8版)》——2.8 作业
- CSS环绕球体的旋转文字-3D效果
- 我的影视作品,如何在博客园发布带有CSS样式的HTML
- css透明的及z-index
- CSS: inline、block和inline-block的区别
- 浅析如何给css加上模块的功能以及CSS Modules用法介绍
- NuxtJS处理因css在服务端渲染而增加源代码量,从而影响到SEO的问题及VUE提取 CSS 到单个文件
- CSS学习知识整理(五)Css display(显示)
- CSS学习知识整理(二)Css 背景
- CSS学习知识整理(一)Css 布局
- 【web前端初级课程】第三章 CSS的特殊样式
- 关于css的touch-action属性
- Error: Cannot find module 'css-loader/locals'
- CSS 加粗(css font-weight)
- Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js): ModuleBuildError: