-
简单无序列表 <ul><li></li></ul> 为每个列表项添加超链接,可以设置空链接(#) <a href="#"></a> 列表中的文字在水平和垂直方向上均居中显示 text-align:center; line-height:30px; 超链接初始状态和访问后的状态均为黑色无下划线 a:link,a:visited{text-decoration:none;color:#000;display:block;} 鼠标经过和点击时文字均为白色,无下划线,背景颜色为#BE3948。 a:hover,a:active{text-decoration:none;color:#fff;background-color:#be3948;display:block;} 设置文字颜色不是font-color,而是color 由于a标签属于内联元素,无高度和宽度属性,因此控制鼠标经过状态改变背景颜色时,仅在有文字的地方显示背景颜色。解决的办法是把a标签变为块级元素,display:block 要想让列表在水平方向上排列,需要设置列表项浮动 超链接四种状态的设置顺序;查看全部
-
10设置搜索框样式 10.1定义.search_text{}样式,宽度190px,高度25px 10.2在代码页在文本框设置一个class属性,套用样式search_text 10.3让搜索框居中,在样式中添加margin-top:5px; 10.4设置背景图片,不重复 水平靠右 垂直居中 background:url(../images/search.jpg) no-repeat right center;等同于 /* background-image:url(../images/search.jpg); background-repeat:no-repeat; background-position:right center;*/ 10.5给搜索框设置背景颜色为白色 样式添加background-color:"#FFF" 10.6输入内容把背景图片遮住,用填充来解决,填充就是设置盒子中的内容与盒子周围的距离,这里设置右填充,设置padding-right:25px;(因为背景图片的宽度为25px) 10.7添加文本框边框线细一点,添加border:1px solid #fff;查看全部
-
1.nav_mid_left和nav_mid_right左浮动 2设置nav_mid_left宽度为680px 3设置nav_mid_right宽度为300px 4设置nav_mid_left下的li标签,让它显示在一行:设置左浮动 nav_mid_left li{} Ps:li标签显示在一行,设置浮动 把 li标签的项目符号去掉:清楚项目符号:list-style-type:none; 5清除项目符号:list-style-type:none; 6给li设置固定宽度在li标签中添加宽度100px; ps:li距离很近,给li设置固定宽度 7.li左侧文字离左侧比较近,可以设置每个li的文字居中,设置text-align:center; ps:li左侧文字离左侧比较近,可以设置每个li的文字居中,设置text-align:center; 8让文字在垂直方向上居中,设置行高line-height:40px; ps:让文字在垂直方向上居中,设置行高等于div的高度line-height:40px; 9设置超链接的初始状态和超链接的访问后的状态,设置鼠标经过的状态和鼠标点击的状态 9.1取消下划线,设置颜色白色,黄色,设置字体大小,设置字体, .nav_mid_left a:link,.nav_mid_left a:visited{text-decoration:none; color:#fff; font-size:16px; font-family:"微软雅黑";} .nav_mid_left a:hover,.nav_mid_left a:active{text-decoration:none; color:#ff0; font-size:16px; font-family:"微软雅黑";}查看全部
-
1添加一个nav的div,nav包含nav_left,nav_mid,nav_right的div,nav_mid分成nav_mid_left,nav_mid_right的div 2添加注释 3在nav_mid_left添加ul标签,在ul下添加li标签 3.1 <ul> <li><a href="#">首页</a></li> <li><a href="list.html">关于慕课</a></li> <li><a href="list.html">新闻动态</a></li> <li><a href="list.html">课程中心</a></li> <li><a href="list.html">在线课程</a></li> <li><a href="list.html">人才招聘</a></li> </ul> 4.1在nav_mid_right下添加表单,添加一个action属性,添加一个method属性,一般采用post方法 4.2在form中添加一个input标记,添加一个type属性,属性等于text <form action="" method="post"> <input type="text"/> </form>查看全部
-
导航菜单的实现可以使用有序列表和无序列表,这里使用无序列表 搜索框的制作需要用到表单中的form标签和input标签查看全部
-
导航栏分为左中右三部分,中部分为左右两部分,分别放置导航栏内容和搜索框查看全部
-
1.1.2.6.2.1在.logo_right添加margin-right:10px; 1.1.2.7设置电话号码的颜色为红色,字体为微软雅黑,字体大小为16px; 1.1.2.7.1.tel{font-family:"微软雅黑"; font-size:16px; color:#c00;} 1.1.2.7.2为电话添加span标签,引用.tel类查看全部
-
vertical-align:应用该属性的元素内部基线对其查看全部
-
OK了查看全部
-
页码制作,没功能查看全部
-
mark查看全部
-
1.em为内联元素,要把他改为块级元素后,设置的宽度和高度才有效 2.所有em的背景图片均为num.gif,通过设置background-position属性来控制不同列表项显示不同的背景图片查看全部
-
慕课网首页测试查看全部
-
由于a标签属于内联元素,无高度和宽度属性,因此控制鼠标经过状态改变背景颜色时,仅在有文字的地方显示背景颜色。解决的办法是把a标签变为块级元素,display:block查看全部
-
@@--企业网站综合布局实战-第5章 新闻详细页制作 5-1 新闻详细页制作 ①首行缩进text-indent:2em; 2em表示当前两个字符的大小。 px是【绝对单位】 em是【相对单位】,1em的大小是当前1个字体的大小,因此2em正好是两个字符。 ②text-indent的值允许负值,因此如果想隐藏某个div中的文字可以这样写text-indent:-9999px.查看全部
举报
0/150
提交
取消