html中table设置字体,table的默认属性及css字体

前几天一直忙着敲代码,没有时间整理内容

今天上了关于position的使用,position属性有五个值

1.inherit 从父元素继承 position 属性的值。

2.static 默认值。没有定位,元素出现在正常文档流中( 忽视top ,left, right, bottom,或者z-index的声明)

3.fixed 固定定位 生成绝对定位的元素,相对于浏览器窗口进行定位。

元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。会改变行块元素的默认表现。

4.relative 相对定位 相对于其正常位置进行定位,元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。不会改变元素的默认表现。

5.absolute 绝对定位  生成绝对定位的元素,相对于浏览器窗口进行定位。

元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。

table标签

默认属性

1.display : table ; 此元素会作为块级表格来显示(类似 ),表格前后带有换行符。

2.border-collapse :separate 边框会被分开。属性设置表格的边框是否被合并为一个单一的边框

3.border-spacing: 2px; 该属性指定分隔边框模型中单元格边界之间的距离。在指定的两个长度值中,第一个是水平间隔,第二个是垂直间隔。除非 border-collapse 被设置为 separate,否则将忽略这个属性。尽管这个属性只应用于表,不过它可以由表中的所有元素继承。

4.border-color: grey;

tb o dy>默认属性

1.display: table-row-group 此元素会作为一个或多个行的分组来显示

2.vertical : middle;

3.border-color: inherit;

4.border-collapse : separate;

< t r> t r>默认属性

1.display: table-row ;此元素会作为一个表格行显示

2. vertical :inherit ;

3. border-collapse: seperate ;

默认属性

1.font-weight: bold;

2.display:table-cell;此元素会作为一个表格单元格显示

3.text-indent: internal-center

默认属性

1.display:table-cell;

2.vertical-align: inherit;

colspan: 跨列合并 colspan="0" 指示浏览器横跨到列组的最后一列

rowspan:跨行合并 rowspan="0" 指示浏览器横跨到表格部分的最后一行

二.字体的使用

1.color 文字颜色设置

2.font-size 文字 字号 可以百分比 em父级文字字号的倍数 rem 根的倍数

3.首行缩进设置 中文 text-indent

4.font-weight 字重

5.font-style: 斜体设置 italic 斜体设置 normal正常设置

6.font-family 字体设置

7.文字水平对齐 text-align:

8.text-align:justify 文字两边对齐 有兼容性问题

9.letter-spacing 字符间距

10.word-spacing 单词间距 不支持中文

11.文字修饰 text-decoration overline 上划线 line-through 中划线

12.vertical 垂直对齐方式

13.内容超出处理overflow: auto hidden scroll scroll-x scroll-y

英文没有空格时候不换行 中文没有换行问题

auto容器自适应内容,内容高度超出容易,会出现竖直滚动条,如果内容宽度超出容器,会出现水平滚动条

hidden 是把超出容器的内容部分给裁减掉

scroll

给容器设置滚动条,如果内容没有超出容器,将无法滚动 overflow-x: 对容器的水平方向处理overflow-y: 对容器的垂直方向处理

overflow:auto hidden 两个属性还可以用于清除浮动

font-size小于12px,会默认以12px结算

font-size设置 大于12px按照设置的倍数

小于12px按照12px

100-300 lighter

font-weight:400 相当于 normal

font-weight: 500+ 相当于 bold

table布局 文本格式 字体、列表样式 背景属性 盒子模型 定位 内容大纲 整个页面的布局可以用到table来布局,还可以用div+CSS来对页面进行布局,相对于table布局来说,div+CSS将网页分为内容和表现形式,更利于后期整个网站的维护,一般只要修改css文件中的一个css属性就可以修改页面的样式,可以提高网页的打开速度,这是特性决定了他们的性能,因为浏览器打开网页的时候是同时下载htmlcss的,这样可以边加载边显示内容,而对于table布局来说... 阅读详情

相关推荐

HTML中如何设置表格字体

HTML是一种用于创建网页的标记语言,通过使用HTML标签和属性,我们可以轻松地设置表格的字体样式。在下面的文章中,我将为您提供详细的指导,并提供相应的源代码示例。在这个例子中,我们将字体设置为Arial和sans-serif字体族,这是常用的无衬线字体。通过将上述HTML代码保存为一个HTML文件并在浏览器中打开,您将看到一个带有设置字体样式的表格。标签内部,我们创建了一个简单的表格。总结起来,要设置HTML表格的字体样式,您可以使用CSS的。要设置表格字体,我们可以使用HTML的。

TdMaster的博客 4697

使用CSS设置HTML表格的样式

HTML表格是网页设计中常用的元素之一,通过使用CSS,我们可以轻松地改变表格的外观和样式。本文将介绍如何使用CSS设置HTML表格的样式,并提供相应的源代码示例。首先,我们需要创建一个基本的HTML表格结构。以下是一个简单的表格示例:

ByteEchoX的博客 243

HTML中用table标签做表单,【html】02--使用table表格标签

文章导读:我们做表格使用table标签来承载1、其中table标签中的属性tr(table row):表示行td: 表示列border 表示边框,表示一个像素cellpadding 表示单元格边距cellspacing 表示单元格间距2、优化代码,建立代码结构-------优化一下,一般我们正常的是情况是,头部不会修改,修改的是身体部分,所以用到下面俩,更方便thead:表示列表的头tbody:表...

weixin_35910783的博客 1546

css 禁止换行_HTML+CSS笔记

一、认识HTML<!DOCTYPE html> <!DOCTYPE html> 文档声明,声明网页按照h5标准<html lang="en"> 向浏览器声明该网页是英文网站,zh设置为中文网站<head> </head> 定义文档的信息 此标签定义内容不会向用户展示<meta charset="UTF-8"> 声明为UTF-...

weixin_39737111的博客 813

HTML-3.1 表格table

本系列文章旨在为前端学习者提供实用的学习笔记,代码示例在HBuilder环境中运行,方便读者直接复制练习。文章涵盖了HTML基础内容,包括文本字体样式、列表、超链接、滚动字幕及表格等。特别地,本文详细介绍了HTML表格的使用,通过示例代码展示了如何设置表格边框、单元格间距、对齐方式等属性,并提供了完整的代码块供读者参考。文章还强调了代码的注释和出处标注,鼓励读者进行讨论和反馈。整体内容简洁实用,适合初学者快速掌握HTML表格的基本操作。

HRDMN的博客 805

html table 字体大小_HTML+CSS笔记

一、认识HTML<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> </body> </html><!DOCTY...

weixin_34431283的博客 7971

HTMLCSSCSS的常用属性设置

CSS常用属性设置 背景 ​ CSS 背景属性用于定义HTML元素的背景效果 background-color ​ 设置元素的背景颜色 body { background-color:#ff0000; } background-image ​ 设置元素的背景图像,默认情况下,背景图像进行平铺重复显示,以覆盖整个元素实体。 body { background-image:url('paper.gif'); } background-repeat ​ 设置是否及如何重复背景图像 body {

weixin_52397329的博客 551

htmltable标签及属性

table表格 HTML表格由table标签以及多个tr、th和td标签组成 table表示表格,整个表格要包含在<table></table>标签中 tr表示表格中的行,是单元格的容器,一行可以包括多个单元格 th表示表格中的单元格,我理解为列,th放在tr内表示这一行为标题行,其中的字体默认粗体居中显示 td表示表格中的单元格,我理解为列,td也要放在tr内,可以理解为内容行 tfoot表示表格最后一行 <table>是<tr的上层标签 <tr>

m0_45272038的博客 6253

CSS常用属性

CSS 背景 CSS 背景属性用于定义HTML元素的背景。 CSS 属性定义背景效果: **background-color ** 设置背景颜色,颜色值通常以下面几种方式定义: 十六进制 - 如:"#ff0000" RGB - 如:“rgb(255,0,0)” 颜色名称 - 如:“red” h1 { background-color:#6495ed; } p { background-colo...

JustinNeil的博客 1万+

css常用属性有哪些

在上篇文章我们知道了利用css选择器来对HTML进行简单装饰,**就像做word文档一样,需要对哪一段落修改格式,就需要先选中,css选择器就是这意思。**这格式如何修改,怎么放大字体,怎么加粗,怎么修改背景色等等,就需要知道我们继续熟悉css有哪些常用的属性了。

鑫阳的博客 1224

HTML 标签通用属性

src属性: <img/> <embed/> <bgsound/> <frame/> <iframe><iframe/><input type="password" value="单行文本框" size="20"><input type="text" value="单行文本框" size="20"><marquee width="180"></marquee>设定宽度。href属性: <base/> <a></a> <link/> 标签。<img src="" width="180"/>设定图片宽度。

juan9872的博客 2401

html table设置行高_HTML table行距的改变方法示例

这篇文章主要介绍了HTML table行距的改变方法示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧在使用HTML表的时候有时候需要我们改变行距,但是改变margin,padding,collapse等方法效果都不是很好。在这里我找到了一个实用的小技巧。利用display属性+margin来实现。例子:tr{margin-t...

weixin_39542936的博客 2337

postion使用和table标签的默认属性整理及字体属性初识

前几天一直忙着敲代码,没有时间整理内容 今天上了关于position的使用,position属性有五个值 1.inherit 从父元素继承 position 属性的值。 2.static 默认值。没有定位,元素出现在正常文档流中( 忽视top ,left, right, bottom,或者z-index的声明) 3.fixed 固定定位 生成绝对定位的元素,相对于浏览器窗口

yx2373364的博客 637

css属性

一些css好用属性

m0_45144737的博客 1888

html css表格字体属性,HTML+CSS入门 表格标签的属性

本篇教程介绍了HTML+CSS入门 表格标签的属性,希望阅读本篇文章以后大家有所收获,帮助大家HTML+CSS入门。<1.宽度和高度的属性可以给table标签和td标签使用(tr标签不能使用)2.水平对齐和垂直对齐的属性其中水平对齐可以给table标签和tr标签和td标签使用垂直对齐只能给tr标签和td标签使用3.外边距和内边距属性只能给table标签使用补充内容:1.1表格的宽度和高度默认...

weixin_42347426的博客 306

Typora使用技巧1 —— 更改字体、大小、颜色、背景色,设置图片默认左对齐,修改图片保存路径

更改字体、大小、颜色、背景色 <font face="黑体">我是黑体字</font> <font face="微软雅黑">我是微软雅黑</font> <font face="STCAIYUN">我是华文彩云</font> <font color=red>我是红色</font> <font color=#008000>我是绿色</font> <font color=Blue>我

朝阳39的博客 1万+

asp 设置table 间距_设置table表格

HTMLCSS、JavaScript 网页制作从入门到精通》——第6章 使用表格本节书摘来自异步社区《HTMLCSS、JavaScript 网页制作从入门到精通》一书中的第6章,第6.1节,作者:【美】John Resig(莱西格) , Bear Bibeault(贝比奥特) 译者: 徐涛 更多章节内容可以访问云栖社区“异步社区”公众号查看。第6章 使用表格表格是网页制...文章异步社区20...

weixin_39971435的博客 1137

html表格内文字置顶,css如何让table里的字居中?

css如何让table里的字居中?下面本篇文章就来给大家介绍一下使用CSStable里字居中的方法。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。在CSS中,可以通过设置text-align: center;和vertical-align:middle;来让table里的字水平居中和垂直居中。text-align属性text-align属性指定元素文本的水平对齐方式。属性值:l...

weixin_34625578的博客 2481

DivCSS小结:浏览器默认HTMLCSS样式属性

这个“浏览器默认HTMLCSS样式属性”,在你需要还原默认值的时候,比较有用。开始的时候应用通配选择器 *{margin:0;padding:0;},当需要使用边距的时候,就需要还原HTML默认CSS值了。 但通配选择器在大型网站的构建中,影响性能,可以参考52CSS.com的相关文章,大家还是需要谨慎一些。  以前一直在找这份文档,今天偶然在w3上看到了。除了inl

gjpdeyx的专栏 2617
上一篇: 红安一中2021高考成绩查询,红安一中高考金榜 红安新一中规划
下一篇: 计算机用户使用年龄表,2018年中国网络购物用户规模及使用率、北京网购用户人群学历分布、年龄分布、网购金额分布、网购消费商品占比、网购消费行为、网购体验满意率及网购消费习惯分析[图]...
weixin_39728124
博客等级 码龄9年 35粉丝 133原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符  | 博主筛选后可见
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值