网页设计：第二部分CSS

2024.10.28   今天练习了CSS引入方式和CSS选择器

外部样式表：<link rel="stylesheet"  type="text/css"  href="文件路径">

内部样式表：<style  type="text/css">

                        ...

                      </style>

行内样式表：<div  style="color:red">xxxx</div>

在内部样式表中选择器有：        

        元素选择器：div{}、p{}

        id选择器：#id{}

        class选择器：#.class

        后代选择器：father son{}

        群组选择器：div,p{}

        

 

2024.10.31今天学习了字体样式和文本样式

font-family：字体类型：微软雅黑、Times New Roman

font-size：字体大小：关键字（small、medium、large）；像素值（10px...)

font-weight：字体粗细：bold（较粗）

font-style：字体风格（斜体）:italic

color：字体颜色

text-indent：首行缩进：是字体大小的两倍

text-align：水平对齐：left、center、right

text-decoretion：文本修饰（none去除所有划线、underline、line-through中划线）

text-transform：upercase、lowercase、capitalize（每个单词首字母大写）

line-height：行高

间距：letter-spacing、word-spacing

 

 

 

2021.11.4今天学习了边框样式、列表样式、表格样式、图片样式、背景样式

border-width        border-color        border-style

简写：border：xxx  xxx  xxx

style：none、dashed（虚线）、solid（实线）

border-top        border-left        border-left        border-right        border-bottom

 

list-style-type:none；

list-style-img:url(图片路径)

 

 

captian-side:top/bottom（表格标题位置）

border-collapse:collapse/separate（边框合并）

 

 

vertical-align:top、middle、bottom、baseline

 

background-color：背景颜色

background-image：url(图片路径)   

background-repeat：reprat-x、reprat-y、no-repeat

background-position