当前位置:首页 > 前端开发 > html中表格背景颜色代码,html,表格背景颜色.doc

html中表格背景颜色代码,html,表格背景颜色.doc

7个月前 (05-20)78

html,表格背景颜色

font color=#ff0000>篇一:HTML表格的美化修饰font>

HTML表格的美化修饰

不知道大家发现没有?这之前创建的表格都非常简陋、简单、难看。如何创建一个布局协调、色调统一、美观、大方的表格?这就涉及到对表格的美化修饰。 本节单词记忆:属性 1.cellspacing 2.cellpadding

网页学习网提示:html语言非常简单,不需要逻辑理解,而绝大部分朋友觉得它难以掌握,90%的原因在于英语单词不过关,所以每节记忆几个单词是非常有必要的。

一、什么是表格的美化修饰

表格的美化修饰就是从多方面对表格进行美化修饰,使表格看上去更漂亮、更美观、更合理。对表格进行美化修饰时,主要从以下几个方面进行: 表格的高度、宽度和边框。

表格、行、列的背景。

表格、行、列的对齐方式。

表格的填充、间距属性。

如图1所示就是经过美化修饰之后的表格。

图1 美化修饰过的表格

二、如何对表格进行美化修饰

1.如何设置表格的尺寸和边框

如果不指定表格的高度和宽度,浏览器就会根据表格内容的多少自动调整高度和宽度。如果不指定表格的边框的宽度(border属性),则浏览器将不显示表格边框。若我们既想设置表格的高度和宽度,又想设置表格边框的宽度,那么就得设置表格的高度、宽度和边框属性。

语法:

设置表格的宽度、高度和边框的基本语法:

其中,表格的宽度和高度可以用像素来表示,也可以用百分比(与浏览器当前窗口相比的大小比例)来表示。表格边框宽度只能用像素来表示。WANGYEXX.COM 例如:

浏览器窗口高度的25%的表格。

示例1:

示例1运行效果如图2所示。

图2 表格的尺寸和边框

小经验:表格中border属性只能影响表格四周的边框宽度,而不能影响表格内单元格之间边框尺寸。过宽的边框会影响表格的整体美观,因此一般边框宽度设置不应超过5像素。

2.如何设置背景

(1) 表格背景

表格背景包括表格的背景颜色和背景图像的设置,表格的背景颜色属性bgcolor是针对整个表格的,表格的背景图像属性background也是针对整个表格的,背景图像会令表格

更加美观、更加活泼生动。

语法:

设置表格背景基本语法:

(2) 行背景色

不仅可以对表格整体设置背景,还可以对单独一行设置背景色,行的bgcolor颜色可以覆盖

语法:

设置行的背景色基本语法:

(3) 单元格背景色

不仅可以对表格中行设置背景色,还可以对表格中每一个单元格设置背景色,单元格的bgcolor颜色可以覆盖行的bgcolor属性。

语法:

设置单元格的背景色基本语法:

示例2:

background=images/type_bac

作者:狐狸姐姐
来源链接:https://blog.csdn.net/weixin_29209825/article/details/117810397

“html中表格背景颜色代码,html,表格背景颜色.doc” 的相关文章

给html标签添加 contenteditable 属性,可实现页面可编辑的效果

给html标签添加 contenteditable 属性,可实现页面可编辑的效果

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">...

SpringMVC 表单标签中 htmlEscape 属性的作用

SpringMVC 表单标签中 htmlEscape 属性的作用

一、SpringMVC 表单元素标签 如下: <form:textarea path="remarks" htmlEscape="false"...

HTML常用颜色名

HTML常用颜色名

常用颜色名   作者:不要停止思考-jcn 来源链接:https://blog.csdn.net/qq_41723615/arti...

html的color粉颜色,HTML颜色一览(color)

在HTML里,颜色有两种表示方式。一种是用颜色名称表示,比如blue表示蓝色。另外一种是用16进制的数值表示RGB的颜色值。RGB是Red,Green,Blue意思...

echarts各种字体颜色的修改

echarts各种字体颜色的修改

这篇文章主要讲述Echarts设置字体和线条的颜色相关操作笔记,希望文章对你有所帮助,主要是自己的在线笔记吧。我在前面先放各种修改前后图片颜色的对照,后面再详细介绍代码。这样...

html颜色编辑器,HTML5 渐变色彩编辑器

JavaScript 语言: JaveScriptBabelCoffeeScript 确定 function setInputCol...

HTML 基础【1】 -- 入门介绍 / 基本结构 / 块级标签 / 行内标签

HTML 基础【1】 -- 入门介绍 / 基本结构 / 块级标签 / 行内标签

请先阅读:VSCode安装与前端开发必备插件安装 引言 介绍 当用户通过 Int...

JavaScript中修改背景颜色

JavaScript中修改背景颜色

通过按钮的单击事件,传递参数给函数,从而实现相应的背景颜色变化。 代码如下: <!DOCTYPE html> <html lang="e...

a标签没有disabled属性

a标签没有disabled属性,那么当我们想禁用a标签的点击事件的时候按照下面方法设置。 下面是html代码:  <a id="entry” &n...

html同一段文字设置不同颜色字体,CSS设置一个文字两种颜色

CSS设置一个文字两种颜色属于前端实例代码,有关更多实例代码大家可以查看。 CSS可以将一个文字设置为两种颜色,下面介绍一下如何实现此效果。 代码实...