CSS的相关知识——背景,超链接,列表,表格,奇偶选择器
接着上一篇总结一些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的相关知识——背景,超链接,列表,表格,奇偶选择器的更多相关文章
- 介绍CSS的相关知识
以下是我跟大家分享的有关CSS的相关知识点: ①什么是CSS? css(Cascading Style Sheets)是层叠样式表 ②css的三种样式使用方法: 1,内联样式表:直接在html标签属性 ...
- CSS属性相关知识
Css选择器 选择器的权重 在css中,哪个选择器的权重高,就走谁的样式. 标签选择器的权重是 1 Class选择器的权重是10 Id选择器的权重是100 行间样式的权重是1000 带有关键字 !im ...
- HTML基础标签图片文本超链接列表表格介绍
1.HTML基础标签图片常见代码形式<img src="图片路径地址" alt="属性名" title="占位符">常见的图片格 ...
- css基础-盒子模型+背景和列表
border-style的值: none 无 dotted 点状 dashed 虚线 solid 实线 double 双实线 margin: 垂直方向两个相邻元素都设置了外边距,那么外边距会发生合并 ...
- CSS Hack相关知识
CSS Hack 1.由于不同厂商的浏览器,比如Internet Explorer,Safari,Chrome,Mozila Firefox等,或者是同一厂商的浏览器的不同版本,如IE6和IE7,对C ...
- {前端CSS} 语法 Css的几种引入方式 css选择器 选择器的优先级 CSS属性相关 背景属性 边框 CSS盒子模型 清除浮动 overflow溢出属性 定位(position)z-index
前端CSS CSS介绍 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素,给HTML设置样式,让它更加美观. 当浏览器读到一个样式表,它就会按照这个样式表来对文 ...
- CSS 笔记——列表表格
6. 列表表格 -> 列表 (1)list-style 基本语法 list-style : list-style-image || list-style-position || list-sty ...
- HTML入门基础教程相关知识
HTML入门基础教程 html是什么,什么是html通俗解答: html是hypertext markup language的缩写,即超文本标记语言.html是用于创建可从一个平台移植到另一平台的超文 ...
- 前端三件套 HTML+CSS+JS基础知识内容笔记
HTML基础 目录 HTML基础 HTML5标签 doctype 标签 html标签 head标签 meta标签 title标签 body标签 文本和超链接标签 标题标签 段落标签 换行标签 水平标签 ...
随机推荐
- ng-zorro等组件默认样式的修改
https://www.jianshu.com/p/8b887c2aac06 在项目中修改ng-zorro组件默认样式的一些方法: 类名等 前加::ng-deep: 类名等 前加:root: 类名等 ...
- [转帖]glib gslibc libc 的关系与区别
https://blog.csdn.net/Com_ma/article/details/78692092 [glibc 和 libc] glibc 和 libc 都是 Linux 下的 C 函数库. ...
- Spring(十二)--Spring AspectJ
Spring AspectJ AspectJ是一个面向切面的框架,它扩展了Java语言.AspectJ定义了AOP语法,所以它有一个专门的编译器用来生成遵守Java字节编码规范的Class文件. As ...
- ajax怎么打开新窗口具体如何实现
var newwindow=window.open('about:blank'); jQuery.ajax({ type: 'POST', url: 'clickRate.action', dataT ...
- Ansible PlayBook语法
PlayBook语法实例 playbook是由一个或多个play组成的列表,play的主要功能在于将事先归并为一组的主机装扮成事先通过Ansible中的tasks定义好的角色(play的内容被称为ta ...
- this(ES6箭头函数里的this)
一,了解前须知 1,箭头函数:出现的作用除了让函数的书写变得很简洁,可读性很好外:最大的优点是解决了this执行环境所造成的一些问题.比如:解决了匿名函数this指向的问题(匿名函数的执行环境具有全局 ...
- 微软商店(Microsoft store)删除之后恢复,一行代码搞定
首先以管理员身份运行Windows PowerShell 地址C:\Users\Administrator\AppData\Roaming\Microsoft\Windows\Start Menu\P ...
- 查看Linux服务器硬件信息
一:查看cpu# 总核数 = 物理CPU个数 X 每颗物理CPU的核数 # 总逻辑CPU数 = 物理CPU个数 X 每颗物理CPU的核数 X 超线程数# 查看物理CPU个数cat /proc/cpui ...
- sklearn学习小结
机器学习的一般流程: 1.获取数据 2.数据预处理 3.数据集分拆 4.搭建模型 5.模型评估 6.模型保存 7.模型优化 接下来,以Sklearn为例,一一介绍. 1.获取数据 1.1.导入数据集: ...
- 00:Java简单了解
浅谈Java之概述 Java是SUN(Stanford University Network),斯坦福大学网络公司)1995年推出的一门高级编程语言.Java是一种面向Internet的编程语言.随着 ...