样式表
样式表写在head里面 body前面
<style type = "text/css">
body{
background: yellow
}
</style>
给table赋予属性
table{
height:200px;width:300px;background: black;
}
border 表格边线 属性
solid 实线
属性就近原则：
元素的属性以就近的属性为显示
属性会被离元素更近的属性所覆盖
<head>
<style type = "text/css">
body{
background: yellow
}
</head>
<body style="background-color: red">
</body>
标签选择器 在bead里面选择body内所有td 赋予属性
适用于全局
td {
style ="height: 20%;
width: 100%;
background: blue;"
}
id选择器
适用于页面上的某一个元素属性设置
#yellow {
style ="background-color: yellow;
width: 100%;
height: 20px;"
}
类选择器
适用于全局有很多重复的元素 但是要指定某些元素的属性
.divv{
style ="background-color: blue;
width: 100%;
height: 20px;
}
<div class="divv"></div>
<div id=black></div>
复合定位 #id1 div指的是 id1内部的div
id1 {
background-color: bule;
width: 100%;
height: 200px
}
id1 div {
background-color: yellow;
width: 100%;
height: 50px
}
页面的断点调试 最好以google浏览器调试
页面按F12 拖动调试按钮
可以在调试页面上取消显示元素
可以在样式上通过动态调整数据 观察结果
外部引用样式表
网友评论