当前位置: 首页 > Web前端 > HTML5

优秀程序员HTML5培训班-Css介绍方法及选择器

时间:2023-04-05 23:13:53 HTML5

/写我们的css代码/span{color:yellow;}优秀程序员HTML5培训班-Css介绍方法及选择器01.介绍CSS方法(重点掌握)内联样式内层样式外部样式     3.1链接类型     3.1导入式css介绍目前的互联网前端分为三层:HTML:HypertextMarkupLanguage。从语义的角度描述页面结构。CSS:级联样式表。从美学角度负责页面样式。JS:JavaScript。从交互的角度描述页面行为的CSS:CascadingStyleSheet,层叠样式表。CSS的作用是为HTML页面标签添加各种样式,定义网页的显示效果。一句话:CSS将网页内容与显示样式分离,提高了显示功能。css的最新版本是css3,我们目前正在研究的是css2.1。接下来,我们将讨论为什么使用CSS。HTML的缺陷:不能适配多设备要求浏览器智能化数据和显示不够分离功能不够强大CSS优点:数据和显示分离减少网络流量使整个网站的视觉效果一致改善开发效率(耦合一个人负责写html,一个人负责写css)比如有一个样式,需要展示在一百个页面上,如果用html实现,就需要这样写一百次。现在有了css,只需要再写一遍。现在html只提供数据和一些控件,css完全交给css提供各种样式。内联样式1

2我是一段

3
内联样式复制代码/写我们的css代码/span{color:yellow;}复制代码Externalstyle-linkExternalstyle-import@importurl('./index.css');02.css的选择器:1.基本选择器2.高级选择器基本选择器包括:1.标签选择器标签选择器可以选择所有的标签元素,比如div,ul,li、p等,无论标签隐藏多深,都可以被选中,并且全部被选中,而不是某一个,所以我们说的是“共性”而不是“特征”。gray;font-size:12px;}/labelselector/p{color:red;font-size:20px;}span{color:yellow;}复制代码2.idselector选择相同的idid不能重复页。任何标签都可以设置idid命名约定为字母,数字可以带下划线——大小写严格区分aa和AA是两个不同的属性值复制代码1#box{2background:green;3}45#s1{6color:red;7}89#s2{10font-size:30px;11}复制代码3、class选择器的所谓class:就是class。类与id非常相似。可以添加任何标签,但是类是可以重复的,属于分类的概念。同一个标签可以携带多个类,使用空格分隔的类可以决定前端工程师的css水平有多牛逼?玩完班,就要有“公班”的概念。复制代码.lv{color:green;}.big{font-size:40px;}.line{text-decoration:underline;}复制代码复制代码
paragraph1

paragraph2

paragraph3

复制代码总结:不要试图用课程来结束我们的页面。这个标签需要携带多个类,一起设置样式。每个类应该尽可能小,并且有共同的概念,这样可以使用更多的标签。