web前端开发技术（第3版）储九良著课后实验.pdfVIP

web前端开发技术（第3版）储九良著课后实验 实验7 1.使⽤内联样式表及内部样式表，设计7-9所⽰的页⾯。设计要求如下： （1）使⽤标题字和段落标记进⾏⽂字显⽰，在内部样式表中定义body标记内信息“居中显⽰”，定义p标记字体为“⾪书”。 （2）通过怕标记style属性定义字体⼤⼩属性（font-size）的值为150%，200%，250%,朝辞⽩帝彩云间，不定义任何任何样式。 !DOCTYPE html html head meta charset=UTF-8 titleshi yan 7-1/title style type=text/css body{text-align:center;font-family:⾪书} /style /head body h4早发⽩帝城/h4 p李⽩/p p朝辞⽩帝彩云间，/p p style=font-size:150%;千⾥江陵⼀⽇还。/p p style=font-size:200%;两岸猿⼭啼不住，/p p style=font-size:250%轻⾈已过万重⼭。/p /body /html 2.按如下要求设计“Web前端开发⼯程师⼯作内容”页⾯，设计如图7-10所⽰的页⾯。要求如下： （1）页⾯要求为：Web前端开发⼯程师⼯作内容； （2）页⾯标题：1 号标题字显⽰“Web前端开发⼯程师⼯作内容”；3号标题字显⽰“Web前端⼯程师在不同的公司，会有不同的职能， 但称呼都是类似的。”； （3）采⽤⽆序列表显⽰⼯作内容，分四个⽅⾯，分别是“做⽹站设计、⽹页界⾯开发”“做⽹页界⾯开发”“做⽹页界⾯开发、前台数据 绑定和前台逻辑的处理”“设计、开发、数据处理”；每⼀列表显⽰⼀种不同风格的⼯作内容，其中第⼀列表项ID（li1）样式为“斜体、加 粗、24px、⿊体”；第⼆个列表项类（li2）样式为“背景⾊#9999cc、字符间距 1px”；第三个列表项ID（li3）样式为“字体⼤⼩ 18px、颜⾊红⾊”；第四列表项⾏内样式“颜⾊#0000cc、背景⾊#c0c0c0、⾪书”； （4）定义全局样式为“楷体。蓝⾊”。 !DOCTYPE html html head meta charset=UTF-8 titleWeb前端开发⼯程师⼯作内容/title style type=text/css #li1{font-style:italic;font-weight:bold;font-size:24px;font-family:⿊体;} #li2{background-color:#9999cc;letter-spacing:1px;} #li3{font-size:18px;color:red;} #li4{background-color:#c0c0c0;font-family:⾪书;} body{font-family:楷体;color:blue;} /style /head body h1Web前端开发⼯程师⼯作内容/h1 h3web前端⼯程师在不同的公司，会有不同的职能，但称呼都是类似的/h3 ul li id=li1做⽹站设计、⽹页界⾯开发/li li id=li2做⽹页界⾯开发/li li id=li3做⽹页界⾯开发、前台数据绑定和前台逻辑处理/li li id=li4 style=color:#0000cc设计、开发、数据处理/li /ul /body /html