CSS-基本样式规则.pptx

下载文档

0
0
约1.67千字
约 51页
2024-05-13 发布于广西
举报
版权申诉
保障服务

CSS-基本样式规则.pptx

1、本文档共51页，可阅读全部内容。
2、原创力文档（book118）网站文档一经付费（服务费），不意味着购买了该文档的版权，仅供个人/单位学习、研究之用，不得用于商业用途，未经授权，严禁复制、发行、汇编、翻译或者网络传播等，侵权必究。
3、本站所有内容均由合作方或网友上传，本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺！文档内容仅供研究参考，付费前请自行鉴别。如您付费，意味着您自己接受本站规则且自行承担风险，本站不退款、不进行额外附加服务；查看《如何避免下载的几个坑》。如果您已付费下载过本站文档，您可以点击这里二次下载。
4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等，请点击“版权申诉”（推荐），也可以打举报电话：400-050-0827(电话支持时间：9:00-18:30)。

第十章用CSS美化页面元素;用CSS设置丰富的文字效果;1.CSS文字样式;1.CSS文字样式;;;写一写;1.CSS文字样式;绝对单位;1.CSS文字样式;;1.CSS文字样式;;html

head

title文字大小_相对值/title

style

!--

p.one{

font-size:15px; /*象素，因此实际显示大小与分辨率有关，很常用的方式*/

}

p.onespan{

font-size:200%; /*在父标记的根底上200%*/

}

p.two{

font-size:30px;

}

p.twospan{

font-size:0.5em; /*在父标记的根底上×0.5*/

}

/style

/head

body

pclass=one文字大小span相对值/span，15px。/p

pclass=two文字大小span相对值/span，30px。/p

/body

/html;1.CSS文字样式;1.CSS文字样式;1.CSS文字样式;1.CSS文字样式;font设置综合字体属性;;2.模拟Google公司Logo实例;html

head

titleGoogle/title

style

!--

font-size:80px;

letter-spacing:-2px; /*字母间距*/

font-family:Arial,Helvetica,sans-serif;

}

.g1,.g2{color:#184dc6;}

.o1,.e{color:#c61800;}

.o2{color:#efba00;}

.l{color:#42c34a;}

/style

/head

body

pspanclass=g1G/spanspanclass=o1o/span

spanclass=o2o/spanspanclass=g2g/span

spanclass=ll/spanspanclass=ee/span/p

/body

/html;3.CSS段落文字;text-indent首行缩进;letter-spacing字符间距;line-height行距属性;text-align水平对齐;Vertical-align垂直对齐;text-transform转换英文大小写;4.百度搜索实例;二、用CSS设置图片效果;html

head

title边框/title

style

!--

img.test1{

border-style:dotted; /*点画线*/

border-color:#FF9900; /*边框颜色*/

border-width:5px; /*边框粗细*/

}

img.test2{

border-style:dashed; /*虚线*/

border-color:blue; /*边框颜色*/

border-width:2px; /*边框粗细*/

}

/style

/head

body

imgsrc=banana.jpgclass=test1

imgsrc=banana.jpgclass=test2

/body

/html;图片边框;图片缩放;图片横向对齐方式;图片纵向对齐方式;图文混排;八仙过海实例;三、用CSS设置网页中的背景;页面背景色;用背景色给页面分块;用背景色给页面分块;页面背景图和背景颜色的重复;页面背景图和背景图的重复;页面背景图的位置;页面背景图的位置;固定背景图片;背景样式综合设置;综合练习