-
> >的转义
查看全部 -
本节有一问题，li首页 会因为上面logo 撑开而使得“首页”不能置首。
看了logo图片以后发现logo图片高度为80px，而logo样式高度也设为了80px。
现在水平不够只能提醒自己之后的实践中布局时，样式高度要稍微设置大一点点。
----------------------------------------
2020.8.18
今天发现了把html声明改成与老师的一致就不会出现上述的情况， 看来是和html版本有关。
查看全部 -
设置一个width，margin 0 auto； 可以让文本盒子相对于盒子快速居中。
文本内容line height 设置与盒子 height 相同 可以让文本居中
查看全部 -
hover ：悬停在链接的样式
active： 点击链接时的样式
link：未访问的链接的样式
visited：已经访问过的链接的样式
查看全部 -
浮动框不占文档位置
查看全部 -
块级元素总是要新行开始查看全部
-
text-indent用来规定文本块中首行文本的缩进，但是px是绝对单位，20px不一定正好是两个字符，而em是相对单位，1em的大小是当前1个字体的大小，因此2em正好是两个字符。另提示：text-indent的值允许负值，因此如果想隐藏某个div中的文字可以这样写text-indent:-9999px.
查看全部 -
text-indent 首行缩进
查看全部 -
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>页码的制作</title>
<style>
/*在此定义相关CSS样式*/
.page{
height: 40px;
margin-top: 10px;
text-align: center;
}
.page a{
display: inline-block;
border: 1px solid #E8E8E8;
text-decoration: none;
margin: 5px;
padding: 5px 10px;
}
.page a:link, .page a:visited{
color: #000;
}
.page a:hover, .page a:active{
color: #FFF;
background-color: #cc1b1b
}
</style>
</head>
<body>
<!--在此制作页码的基本结构-->
<div class="page">
<a href="#">首页</a><a href="#">></a><a href="#">1</a><a href="#">2</a><a href="#">3</a><a href="#">...</a><a href="#">></a><a href="#">末页</a>
</div>
</body>
</html>
查看全部 -
块元素和内联元素的基本差异是块元素一般都从新行开始。而当加入了CSS控制以后，块元素和内联元素的这种属性差异就不成为差异了。我们可以通过设置display属性实现块级元素和内联元素的相互转变。
查看全部 -
display：inline-block是兼顾内联元素和块级元素的属性
IE浏览器显示出问题可试用此方法
查看全部 -
background-color 要在background 的后面才有效果
.鼠标悬浮时，背景颜色改变没有占据整行，只改变了文字颜色因为<a>为内联元素，要想它宽高起作用，就要设成块元素 display:block。
背景颜色、图片的简写方法示列：
background: #f2f2f2 url("../images/li_bg2.gif") no-repeat left center;当背景颜色与背景图片同时存在时，只要背景图片没有填充满整个元素，剩余部分显示背景颜色。
查看全部 -
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
/*在此定义相应的类选择器，并根据要求设置相关CSS属性*/
.mainBox{
width:960px;
height: 300px;
background-color:#CFF;
border:1px solid red;
}
.leftBox{
width: 740px;
height: 300px;
background-color: #C9F;
float: left;
}
.rightBox{
width: 210px;
height: 300px;
background-color: #FCF;
float: left;
margin-left: 10px;
}
</style>
</head>
<body>
<!--在此添加相应的div标签-->
<div class="mainBox">
<div class="leftBox"></div>
<div class="rightBox"></div>
</div>
</body>
</html>
查看全部 -
大型网站，主流清除浮动方法：浮动元素的父元素 class="clearfix"，
css定义 .clearfix{ clear:both; content:"."; height:0; overflow:hidden; }min-height:350px;设置这个盒子的最小高度为350px;
但这个写法在IE6下面不被识别
可以采用_height';350px;
查看全部 -
本课程总结：
1、行内样式的优先级高于外部样式
2、行内样式适合于少量样式的地方
查看全部
举报