第四章css初识
1.CSS(层叠样式表)
2.CSS语法
选择器{
属性名1:属性值1;
属性名2:属性值2;
}
3.引用CSS的三种方式
第一种:行内样式
例:<a style="color:red;">内部样式</a>
第二种:内部样式
在head标签中,写入style标签.
例:
<head>
.......
<style type="text/css">
h1{
.........
}
</style>
</head>
第三种:外部样式
使用步骤:
a)创建一个以.css为后缀的文件(css文件)
b)在html中通过link引入css文件
<link rel="stylesheet" href="css文件路径"/>
4.基本选择器
4.1 标签选择器
标签名{}
4.2 类选择器
.class属性值{}
4.3 id选择器
#id属性值{}
5.层次选择器
5.1 后代选择器
父元素 子元素{}
5.2 子选择器
父元素>子元素{}
5.3 相邻兄弟选择器
本元素+相邻兄弟元素{}
5.4 通用兄弟选择器
本元素~兄弟元素{}
6.结构伪类选择器
E F:first-child{} //第一个子元素
E F:last-child{} //最后一个子元素
E F:nth-child(?){} // ?表示第几个子元素,还可以使odd奇数,even偶数
E F:first-of-type{} //指定类型的第一个元素
E F:last-of-type{} //指定类型的最后一个元素
E F:nth-of-type(?){} //?表示指定类型第几个子元素
注意:
E F:nth-child(n)在父级里从一个元素开始查找,不分类型.
E F:nth-of-type(n)在父级里先看类型,再看位置.
7. 属性选择器
E[attr] //具有属性attr的元素
E[attr=val] //属性attr的值是val的元素
E[attr^=val] //属性attr的值以val开头的元素
E[attr$=val] //属性attr的值以val结尾的元素
E[attr*=val] //属性attr的值包含val的元素
第四章css初识的更多相关文章
- web—第四章css&第五章
web—第四章css&第五章 终于迎接等待已久的CSS,在没学这个之前,我们只会用一点img,查一点小图片,或者是用style改一下颜色,而且比较麻烦.现在多了个css在文件夹在创建一个cs ...
- 第四章 CSS基础
1.CSS是cascading style sheets 层叠样式表.样式定义如何显示html元素,通常存储在样式表中,将样式添加到html中,是为了解决内容与表现分离的问题. 2.外部样式表可以极大 ...
- 第四章:初识CSS3
1.CSS规则由两部分构成,即选择器和声明器 声明必须放在{}中并且声明可以是一条或者多条 每条声明由一个属性和值构成,属性和值用冒号分开,每条语句用英文冒号分开 注意: css的最后一条声明,用以结 ...
- [CSS]《CSS揭秘》第四章——视觉效果
投影 单侧投影 box-shadow:0px 10px 10px -5px black; 邻边投影 box-shadow:10px 10px 10px 2px black; 双侧投影 box-shad ...
- 《Django By Example》第四章 中文 翻译 (个人学习,渣翻)
书籍出处:https://www.packtpub.com/web-development/django-example 原作者:Antonio Melé (译者注:祝大家新年快乐,这次带来<D ...
- 《深入理解bootstrap》读书笔记:第4章 CSS组件(下)
十. 标签(.label类,label-xxx) 高亮一些标题部分. 1 2 3 4 5 6 <h1>HELLO<span class="label label-defau ...
- 第四章SignalR自托管主机
第四章SignalR自托管主机 SignalR服务器通常在IIS的Asp.Net应用程序上承载,但它也可以使用自托管库来作为自托管的主机来运行(就像控制台应用程序或Windows服务那样)与Signa ...
- Knockout应用开发指南 第四章:模板绑定
原文:Knockout应用开发指南 第四章:模板绑定 模板绑定The template binding 目的 template绑定通过模板将数据render到页面.模板绑定对于构建嵌套结构的页面非常方 ...
- JavaScript DOM编程艺术-学习笔记(第三章、第四章)
第三章: 1.js的对象分为三种:①用户自定义对象 ② 内建对象(js提供的对象) ③宿主对象(js寄宿的环境-浏览器,提供的对象) 2.文档是由节点组成的集合,即dom树,html元素是根元素,是唯 ...
随机推荐
- sqlite3出现SQLITE_BUSY错误码的原因以及解决方法
转载:https://www.cnblogs.com/lijingcheng/p/4454884.html 转载:https://blog.csdn.net/venchia_lu/article/de ...
- flutter插件汇总2
作者:知乎用户链接:https://www.zhihu.com/question/307594373/answer/568969429来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载 ...
- Polly 熔断策略
熔断策略主要以 CircuitBreaker 来完成. 工作原理 熔断器可以被看作为一个主要含有三个状态的状态机 如果以电路开关来看: 开关闭合对应 CLOSED 状态, 开关打开对应 OPEN 状态 ...
- Docker Swarm Mode 学习笔记 (部署服务)
使用 docker service 命令来管理 Swarm 集群中的服务,该命令只能在管理节点上执行. 新建服务 docker service create --replicas 3 -p 80:80 ...
- SAP 跨公司销售业务
SAP 跨公司销售业务 http://blog.sina.com.cn/s/blog_95ac31e30102x5wh.html 分类: SAP_SD SAP 跨公司销售业务 一.业务简介 在由 ...
- shell for 循环
test.sh #!/bin/bash for str in "C语言" "http://www.bilibili.com" "成立7年了" ...
- 大牛的IT经验,方法【跟,帮】
学习方法一:实践,应用,坚持. [swoole-韩天峰] 我最开始工作也是在2家小公司,后来加入腾讯阿里,主要原因还是我坚持学习基础知识,从而得到了这个机会.有几个方面的基础知识,我建议每一位PHP程 ...
- MPU6050可以读取器件ID值,但读出的加速度计和陀螺仪的数据均为零
今天在调试MPU6050时发现,MPU6050可以正常读取器件ID,但读取的加速度计和陀螺仪的数据均为零. 经过排查发现,MPU6050第20脚的电容没用焊接,C6可以使用10uF的电容.
- python+selenium的web自动化测试之一(手工执行)
环境 Windows 前提: 1. python已正常安装 2. selenium已正常安装. 如果没安装,会报:ImportError: No module named 'selenium' (参考 ...
- guxh的python笔记十一:异常处理
1,抓错方法 name = [0, 1, 2] try: name[3] except IndexError as exc: # 抓单个错误,打印错误信息e print(exc) except (In ...