html 表格 字号,CSS 基础字体文本列表表格样式

本文详细介绍并实例演示了CSS样式在网页布局中的应用技巧,包括背景样式、文本样式、字体样式、链接状态样式、列表样式及表格样式的设置方法。通过具体代码示例,读者可以快速掌握如何使用CSS实现美观且功能丰富的网页设计。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1.css常用样式1

5420fd4b78cceaf374cc4a4ed36b5135.png

bc2906654b1c63dc579b13fa1f73a08c.png

68f0db267fcc239d2f1ad25a5359ae4a.png

0.CSS样式

#b{ background-color:orange;width:350px;}

#a{    color:DarkOrchid;}

#c{background-image:url(../../static/app2/images/images.jpg);

background-repeat: no-repeat;}

#d{text-indent:5em;}

#e{text-align:left;}

#f{word-spacing:30px;}

#g{letter-spacing:5px;}

#h{text-transform:capitalize;}

#i{text-decoration:overline line-through underline;}

#j{font-family:Georgia;}

#k{font-weight:900;}

#l{font-size:22px;}

#m{font-size:20;}

p a:link{text-decoration:none;background-color:#B2FF99;}

p a:visited{text-decoration:none;background-color:#FFFF85;}

p a:hover{text-decoration:none;background-color:#FF704D;}

p a:active{text-decoration:none;background-color:#FFFF85;}

#aa{list-style: square} /*改变前面的符号*/

#ab{list-style: none} /*去掉前面的符合*/

#ac li{list-style-image:url(../../static/app2/images/tb.jpg)} /*更换标志*/

table,tr,td{border:1px solid green;} /* 表格边框*/

th{background-color:green;color:white;}/*文本背景颜色*/

table{border-collapse:collapse; } /*折叠边框*/

table{width:30%;} /*宽度*/

th{height:50px;}/*高度*/

td{text-align:right;vertical-align:bottom}/*文本对齐*/

td{padding:10px;}/*内边距*/

1.html文件

html

1.背景样式-----------------------------------

颜色:color

背景色:backgound-color

背景图片:background-image

2.文本样式------------------------------------

缩进:text-indent

对其方式:text-align

字间隔:word-spacing wang

字母间隔:letter-spacing

首字母大小写转换:text-transform

文本装饰:test-decoration

3.字体样式--------------------------------

字体:font-family

字体加粗:font-weight

字体大小:font-size

字体大小:font-size

4.鼠标进过链接样式----------------------------------

鼠标点击经过字体及连接背景颜色等

5.列表样式----------------------------------

  • 列表01
  • 列表01
  • 列表01
  • 列表02

6.表格样式------------------------------------------

11
11
22

=======================================================

10ff050773a25c44cbdac14878a10a0b.png

ef7235f93819b60cc70afffd28e1e2ba.png

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值