九月四号作业讲解:

来源：互联网发布：三星n9008刷4g网络编辑：程序博客网时间：2024/04/30 19:02

1，类选择器，将class为 p1,p2的段落行高设置为10px

解题：

<1>.元素选择器，就是通过标签名字找到这个元素的，例如 p---->就代表找到所有的p标签

解答：

类选择器，通过类属性找到某个标签的方法，用法 .类名，为了更具体的定位到某个元素，我们通常还会这样写 p.p1---->代表找到class为p1的p标签

<html>

<head>

</head>

<style>

.p1

{

line-height:10px;

}

.p2

{

line-height:10px;

}

/*或

.p1,.p2

{

line-height:10px;

}

</style>

<body>

</body>

</html>

2.id选择器，将id 为 bg的div背景设置为，这张图片，不平铺

解答：

<2>.*id选择器，就是通过id属性来找到某个标签的方法，用法 #id值，注意：id属性是唯一的，同一个标签不能重复使用

<html>

<head>

</head>

<style>

#bg{

background-image:url("baidu.png"); /*显示图片*/

height:32px; /*高度为32PX*/

background-repeat:no-repeat; /*图片不平铺*/

}

</style>

<body>

<div id="bg"> 这是div</div>

</body>

</html>

3，关联选择器，将茄子加粗，将黄瓜变为斜体

解答：

<3>.关联选择器，又称为上下文关系选择器，通过标签的上下文关系来找到这个标签，用选择器(空格) 选择器，表示第一个标签里面的标签

<html>

<head>

<style>

ul.ul1 li.vegetable

{

font-weight:bold;

}

ul.ul2 li.vegetable

{

font-style:italic;

}

</style>

</head>

<body>

</ul>

</ul>

</body>

</html>

4，组合选择器，将黄瓜和 class为p1的段落字体设置为 35px

解答：

<4>.组合选择器，多个选择器之间并列的共享一个样式，用法：用，隔开

<html>

<head>

<style>

ul.ul2 li.vegetable,.p1

{

font-size:35px;

}

</style>

</head>

<body>

</ul>

</body>

</html>