将设计师的图纸转换成代码,即利用(X)HTML/CSS/JavaScript/DOM/Flash等各种Web技术进行产品的界面开发。前端既不是美工,也不是后端,比设计更懂技术,比后台更懂交互,是连接美工和后端工程师的桥梁,是接近用户体验的岗位
WEB前端课程特点
边学边练、实战项目训练
复合选择器
一、为什么需要复合选择器
在实际的网而制做过程中往往会出现很多结构层级嵌套很深的现象, 而这种结构模块又
很多,大家使用的标签名称又一样。所以此时我们就可以通过复合选择器,将这些简单选择
器进行组合。从而让我们选择元素变得简单。
二、常见的复合选择器:
后代选择器:这种选择器就是以某一个元素为起点,将它做为祖先然后不停的向下进行
穿透查找,去选择它下面的后代元素。
起点元素 后代元素 …{ 设置样式 }
注:
并列选择器:就是将多个选择器使用 逗号 进行连接,表示同时选中这些元素,然后设置相同的样式。其中每个部分的选择器都可以由任意类型的选择器构成。
选择器权重总结
简单选择器: id 名 》 class 名 》 element 名
复合选择器: 需要在大家明白的就是复合选择器由多个其它类型选择器组合而成,为了方
便比较,我们人为的给每个简单选择器都定义了一个数值,分别是: Id(100) class(10)
ele(1),这三个数值我们也称之为权重值,有了它们之后只需要将当前选择器中出现的权重值
进行相加求,终的结果就是该选择器的权重。数值越大的权重越大
切记权重比的就是不同选择器对同一个元素的控制力比较( 区别继承的影响 )
CSS 文件存放位置
CSS 代码可以被我们放在很多的地方,习惯性的有三种写法:内嵌 CSS 、外链 CSS、行内 CSS 。
内嵌 CSS 指的就是将 CSS 代码写在 html 网页中。
外链 CSS 指的就是就将 CSS 代码写在外部的独立 CSS 文件中。
行内 CSS 指的就是将 CSS 代码写在具体的 HTML 标签身上 。
注:
依据浏览器渲染页面原理,我们选将 CSS 代码写在 HTML 文件靠前的位置。
使用外链 CSS 写法的时候,外部独立的 CSS 文件当中不需要写 style 标签,同时还需通过 link 标签将某个 CSS 文件引入到具体的 HTML 文件当中。 rel 属性对不要省略
对于上述的三种 CSS 文件存放位置来说,行内 CSS 的权重是,但是外链与内
嵌并不存在谁一定大于谁的现象( 权重 ),它的控制能力完全取决于各自所使用的选择器权重。
如果想要直接将某一个样式的权提至,我们只需要在该句 CSS 代码的设置