一、选择器

通过什么方式来定位

1、sytle标签

style标签功能:写css样式的
sytle标签的几种写法:1、可以在head里面添加一个style标签
2、在head标签中 通过link标签,引入css样式表 <link rel= "stylesheet" href="xxx.css">
3、也可以在body中某标签里面直接添加style样式属性 如:<div id="i1" style="">

stylesheet是一个样式表

2、id 选择器

3、class标签

4、标签选择器

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
div{
height: 100px;
width:100px;
background-color: pink;
}
</style>
</head>
<body>
<!--标签选择器-->
<div></div>
</body>
</html>

<!--标签选择器的优点:不需要在style中特别定义,直接可以用,
缺点:当前html页面的所有div都应该这个样式,写多少个div都是应用这个样式-->

5、标签层级选择器
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
div span{
background-color: blue;
}
</style>
</head>
<body>
<!--标签层级选择器-->
<div>
<span>层级</span>
</div>
</body>
</html>
 

前端知识-CS-01的更多相关文章

  1. 从输入URL到页面加载的过程?如何由一道题完善自己的前端知识体系!

    前言 见解有限,如有描述不当之处,请帮忙指出,如有错误,会及时修正. 为什么要梳理这篇文章? 最近恰好被问到这方面的问题,尝试整理后发现,这道题的覆盖面可以非常广,很适合作为一道承载知识体系的题目. ...

  2. 移动端 Web 开发前端知识整理

    文章来源: http://www.restran.net/2015/05/14/mobile-web-front-end-collections/ 最近整理的移动端 Web 开发前端知识,不定期更新. ...

  3. web前端知识体系总结

    1. 前言 大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的 ...

  4. 3 HTML&JS等前端知识系列之javascript的基础

    preface 作为一名运维开发,必须懂得前端知识,比如javascript,dom等等,下面就聊聊javascript. include 数据格式 条件判断,循环流程等. 函数 面向对象 what ...

  5. 自己总结的web前端知识体系大全【欢迎补充】

    1. 前言 大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的 ...

  6. WEB前端知识体系脑图

    说在开始的话: 我上大学那会,虽说主要是学Java语言,但是web前端也稍微学了一些,那时候对前端也没多在意,因为涉入的不深,可以搞一个差不多可以看的界面就可以了,其他也没过多在意. 因为稍微了解一点 ...

  7. Web前端知识技能大汇总

    项目起源 还记得@jayli 的这幅前端知识结构图么. 图片的形式具有诸多的不便.缺失源图的我们,无法为此图贡献些什么,随着时间的迁移,或许有些技术点会发生改变,所以有了这个GitHub项目.我们可以 ...

  8. 移动Web 开发中的一些前端知识收集汇总

    在开发DeveMobile 与EaseMobile 主题 的时候积累了一些移动Web 开发的前端知识,本着记录总结的目的,特写这篇文章备忘一下. 要说移动Web 开发与传统的PC 端开发,感觉也没什么 ...

  9. web前端知识体系大全

    1. 前言 大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的 ...

  10. JS前端知识模块大全

    公司前端:小胖提供,表示感谢 1. 基础 HTML, CSS, JS 文档 W3CSCHOOL: http://www.w3schools.com/ MDN: https://developer.mo ...

随机推荐

  1. Google reCAPTCHA 2 : Protect your site from spam and abuse & Google reCAPTCHA 2官方教程

    1

  2. koa-router all in one

    koa-router all in one holy shit , WTF, which is the true koa-router! MMP, 哪一个是正确的呀,fuck 找半天都晕了! koa- ...

  3. TypeScript 4.0 New Features

    TypeScript 4.0 New Features $ npm install typescript@beta https://devblogs.microsoft.com/typescript/ ...

  4. kahoot

    kahoot Make learning awesome! https://kahoot.it/ https://kahoot.com/ 我们的平台可让您在几分钟内轻松创建,共享和玩学习游戏或琐事测验 ...

  5. Taro Advanced

    Taro Advanced aro 代码与小程序代码混写 https://nervjs.github.io/taro/docs/hybrid.html https://github.com/NervJ ...

  6. Android 比较好看的注册登录界面

    各位看官姥爷: 对于一款android手机app而言,美观的界面使得用户有好的使用体验,而一款好看的注册登录界面也会给用户好的用户体验,那么话不多说,直接上代码 首先是一款简单的界面展示 1.登陆界面 ...

  7. listen EADDRINUSE: address already in use ::: 端口被占用

    netstat -ano|findstr "端口号" // 查询被占用端口号的pid(3000,端口号则是被占用的端口号) taskkill /pid 8888 /F // 结束端 ...

  8. 从微信小程序到鸿蒙js开发【15】——JS调用Java

    鸿蒙入门指南,小白速来!0基础学习路线分享,高效学习方法,重点答疑解惑--->[课程入口] 目录:1.新建一个Service Ability2.完善代码逻辑3.JS端远程调用4.<从微信小 ...

  9. teamviewer远程是账号密码都没错但是报正在初始化参数...

    1.出现这个原因,可能是 通过(mstsc)远程桌面方式运行了teamviewer,被远程控制电脑就会出现这个现象. 可以试一下 服务-teamviewer-属性-登录-本地系统账户 -允许服务与桌面 ...

  10. 开工大吉:TcaplusDB将持续为您提供可靠的数据服务

    开工大吉 新的一年 新的开始 我们也带着新的心意 向您奔赴而来    在此,TcaplusDB祝广大客户朋友,开工大吉,2021,我们将一如既往地守护您的数据,继续做您最坚实的后盾.    作为专为游 ...