Border-collapse | 学习笔记

简介: 快速学习 Border-collapse。

开发者学堂课程【CSS 快速掌握Border-collapse】学习笔记,与课程紧密联系,让用户快速学习知识。

课程地址:https://developer.aliyun.com/learning/course/611/detail/9206


Border-collapse


内容介绍

一、border-collapse 简介


一、border-collapse 简介

这个属性主要是用于来合并边框线 其值为:collapse

border-collapse : collapse;

例子:

<!DOCTYPE html>

<html lang=”en”>

<head>

<meta charset=”UTF-8”>

<title>合并表格的边框线</title>

<style type=”text/css”>

table{

border-collapse:collapse;

/*给边框设置颜色*/

border-color:#ccc;

 

</head>

<body>

Table>tr*10>{&nbsp:}*10

</body>

</html>

 

< ! DOCTYPE htmI>

<html lang="en">

<head>

 <meta charset= "UTF-8">

  <title>使用CSS3 中的结构伪类选择器来实现隔行变色的表格</title>

<style type="text/css"> I

table{

 border- collapse: collapse;

}

table tr:nth- child(even){

background-color: #f00;

}

table tr:nth- child(odd){

background-color: #00f;

}

/*当鼠标移动到 tr 上面的时候显示背景颜色为#ccc*/

table tr:hover{

background-color: #ccc;

}

</style>

</head>

<body>

<table width="500” border="1" align="center">

相关文章
|
5月前
|
人工智能 自然语言处理 安全
ChatBI,用AI自然语言与数据对话
在数字经济快速发展的2025年,企业数据量激增,市场对快速决策和深度分析提出更高要求。本方案介绍如何通过阿里云Quick BI工具,结合AI能力,帮助商业分析师高效应对数据洪流,实现智能化分析、快速决策,提升业务洞察力与决策效率。
ChatBI,用AI自然语言与数据对话
|
监控 Java 应用服务中间件
Spring Boot整合Tomcat底层源码分析
【11月更文挑战第20天】Spring Boot是一个用于快速构建基于Spring框架的应用程序的开源框架。它通过自动配置和起步依赖等特性,大大简化了Spring应用的开发和部署过程。本文将深入探讨Spring Boot的背景历史、业务场景、功能点以及底层原理,并通过Java代码手写模拟Spring Boot的启动过程,特别是其与Tomcat的整合。
327 1
|
Linux Python
【Linux】查看目录和更改目录
【Linux】查看目录和更改目录
317 3
SpringBoot 项目启动初始化一个Map对象到内存
SpringBoot 项目启动初始化一个Map对象到内存
344 1
|
存储 测试技术 持续交付
团队配置管理规范:高效协作的秘诀与浅见
介绍软件配置管理规范的一些内容
439 2
大学物理(上)-期末知识点结合习题复习(4)——质点运动学-动能定理 力做功 保守力与非保守力 势能 机械能守恒定律 完全弹性碰撞
大学物理(上)-期末知识点结合习题复习(4)——质点运动学-动能定理 力做功 保守力与非保守力 势能 机械能守恒定律 完全弹性碰撞
453 0
|
XML API 数据库
API介绍
API介绍
966 1
|
JavaScript 索引 容器
vue-drag-resize拖拽组件实际应用
vue-drag-resize拖拽组件实际应用
2430 0
vue-drag-resize拖拽组件实际应用
|
分布式计算 Hadoop 开发工具
docker 部署 hadoop集群
docker 部署 hadoop集群
vue3 引用组件 父组件传递参数给子组件
vue3 引用组件 父组件传递参数给子组件
401 0