接着上一篇总结一些css的相关知识

㈠背景

背景属性

1.background-color 背景颜色   rgb函数设置

2.background-image   背景图片  url(“logo.jpg”)

添加一个url函数,这个函数括号括起来,参数双引号之内带有的是添加成背景图片的这个图片的完整路径(相对路径)和文件名。

3.background-repeat   背景填充方式   (棋盘格的填充)

⑴取值为repeat,作为背景图片填充整个页面。

⑵取值为repeat-x,单向填充,横向填充一行。

⑶取值为repeat-y,单向填充,纵向填充一列。

⑷取值为no-repeat,把上面所有的分量都用background属性统一设置。顺序:背景颜色,背景图片,重复填充方式

㈡超链接

链接的四种状态

1.a:link           普通的,未被访问的链接

2.a:visited      用户已访问的链接

3.a:hover       鼠标指针位于链接的上方悬停

4.a:active      链接被点击的时刻(被点击时处于被激活状态)

这四种链接方式叫做伪类选择器

1,次序:⑴.a:hover:必须位于a:link 和.a:visited之后

                 ⑵a:active:必须位于a:hover 之后

2.css超链接,鼠标悬停放大字体

㈢列表  list

无序列表ul和有序列表ol共用样式

   属性                                                      描述

1.list-style                         所有用于列表的属性设置于一个声明中

2.list-style-image              为列表项标志设置图像

3.list-style-position           标志的位置

4.list-style-type                 标志的类型

 

*list-style-type  的相关属性值

㈣表格 table

1.表格大小:width(宽),height(高)

2.表格边框:border属性,table,td,th,border-collapse属性

3.border-collapse属性

例如:table{border-collapse:collapse;} 为叠加或坍缩的意思,这样表格边框和单元格边框就重叠成一个了。

4.奇偶选择器:    :nth-child(odd/even)   odd:奇数个元素  even:偶数个元素

例如:tr:nth-child(odd){background-color:#EAF2D3;}

奇偶选择器常在下面表格样式隔行设置不同颜色中应用

注意:⑴奇数个是从第一行开始设置的(tr父元素table的第一个子元素开始,奇数个元素)

           ⑵第一行为表头单元格,加入th标签来进行设计。

  希望有所帮助。

CSS的相关知识——背景,超链接,列表,表格,奇偶选择器的更多相关文章

  1. 介绍CSS的相关知识

    以下是我跟大家分享的有关CSS的相关知识点: ①什么是CSS? css(Cascading Style Sheets)是层叠样式表 ②css的三种样式使用方法: 1,内联样式表:直接在html标签属性 ...

  2. CSS属性相关知识

    Css选择器 选择器的权重 在css中,哪个选择器的权重高,就走谁的样式. 标签选择器的权重是 1 Class选择器的权重是10 Id选择器的权重是100 行间样式的权重是1000 带有关键字 !im ...

  3. HTML基础标签图片文本超链接列表表格介绍

    1.HTML基础标签图片常见代码形式<img src="图片路径地址" alt="属性名" title="占位符">常见的图片格 ...

  4. css基础-盒子模型+背景和列表

    border-style的值: none 无 dotted 点状 dashed 虚线 solid 实线 double 双实线 margin: 垂直方向两个相邻元素都设置了外边距,那么外边距会发生合并 ...

  5. CSS Hack相关知识

    CSS Hack 1.由于不同厂商的浏览器,比如Internet Explorer,Safari,Chrome,Mozila Firefox等,或者是同一厂商的浏览器的不同版本,如IE6和IE7,对C ...

  6. {前端CSS} 语法 Css的几种引入方式 css选择器 选择器的优先级 CSS属性相关 背景属性 边框 CSS盒子模型 清除浮动 overflow溢出属性  定位(position)z-index

    前端CSS CSS介绍 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素,给HTML设置样式,让它更加美观. 当浏览器读到一个样式表,它就会按照这个样式表来对文 ...

  7. CSS 笔记——列表表格

    6. 列表表格 -> 列表 (1)list-style 基本语法 list-style : list-style-image || list-style-position || list-sty ...

  8. HTML入门基础教程相关知识

    HTML入门基础教程 html是什么,什么是html通俗解答: html是hypertext markup language的缩写,即超文本标记语言.html是用于创建可从一个平台移植到另一平台的超文 ...

  9. 前端三件套 HTML+CSS+JS基础知识内容笔记

    HTML基础 目录 HTML基础 HTML5标签 doctype 标签 html标签 head标签 meta标签 title标签 body标签 文本和超链接标签 标题标签 段落标签 换行标签 水平标签 ...

随机推荐

  1. java 寻找水仙花数

    题目:打印出所有的"水仙花数",所谓"水仙花数"是指一个三位数,其各位数字立方和等于该数本身.例如:153是一个"水仙花数",因为153=1 ...

  2. PostgreSQL编码格式:客户端服务器、客户端、服务器端相关影响

    关于字符编码这块,官网链接: https://www.postgresql.org/docs/current/charset.html 刚刚写了几百字的东西因为断网,导致全没有了,重头再写,我就只想记 ...

  3. MYSQL—第一部分(简介和windows版本的安装)

    一.概述 1.什么是数据库 ? 答:数据的仓库,如:在自己编写的程序中我们创建了一个 db 目录,称其为数据库 2.什么是 MySQL.Oracle.SQLite.Access.MS SQLServe ...

  4. oracle数据段详解

    Tablespace(表空间):表空间是数据库的逻辑划分,一个表空间只能属于一个数据库.所有的数据库对象都放在指定的表空间中,但主要存放的对象是表,所以称为表空间. 默认的系统表空间:system.s ...

  5. opencv学习之读取图像-imread函数

    序 想要完整全面地学习opencv,仅凭阅读samples的示例源码是不够的.毕竟opencv是一个拥有非常多函数的程序库,所以在每学习一个函数时,芒果觉得有必要记录下来,分享给有需要的同学.于是,就 ...

  6. python_0基础开始_day09

    第九节 1,函数初始 s = "qwertyuiop"n = 0for i in s:    n += 1print(n)​lst = [1,2,3,4,5]n = 0for i ...

  7. Postman之简单使用

    前提:已获得接口文档 / 抓包数据 1.启动Postman 直接在这个页面输入数据(不用管其他的地方!!!) 2.按照接口文档填入 注意蓝色框中的数据 请求方式:POST(几乎都是使用POST/GET ...

  8. python基础之函数当中的装饰器

    在实际工作当中存在一个开放封闭原则 1.对扩展是开放的 为什么要对扩展开放呢? 我们说,任何一个程序,不可能在设计之初就已经想好了所有的功能并且未来不做任何更新和修改.所以我们必须允许代码扩展.添加新 ...

  9. ELK视频下载

    Elasticsearch , Logstash, Kibana 相关视频下载地址:Beats.Elastic Stack.ElasticSearch.Kibana.Logstash下载地址:链接:h ...

  10. 牛客挑战赛32E 树上逆序对

    nowcoder 口胡一时爽 先从这个逆序对的性质入手,手玩可以发现对于一对具有祖先关系节点的点,只有权值绝对值大的才能对这一对点是否为逆序对造成影响.具体来讲,如果祖先点权值大,并且取正号,那么其后 ...