为了账号安全,请及时绑定邮箱和手机立即绑定

企业网站综合布局实战

zkpplpp PHP开发工程师
难度初级
时长 2小时55分
学习人数
综合评分9.73
544人评价 查看评价
9.8 内容实用
9.8 简洁易懂
9.6 逻辑清晰
  • 简单无序列表 <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 要想让列表在水平方向上排列,需要设置列表项浮动 超链接四种状态的设置顺序;
    查看全部
    0 采集 收起 来源:编程练习

    2018-03-22

  • 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了
    查看全部
    0 采集 收起 来源:编程练习

    2015-05-01

  • 页码制作,没功能
    查看全部
    0 采集 收起 来源:编程练习

    2015-05-01

  • mark
    查看全部
    0 采集 收起 来源:编程挑战

    2015-04-30

  • 1.em为内联元素,要把他改为块级元素后,设置的宽度和高度才有效 2.所有em的背景图片均为num.gif,通过设置background-position属性来控制不同列表项显示不同的背景图片
    查看全部
    0 采集 收起 来源:编程练习

    2015-04-30

  • 慕课网首页测试
    查看全部
    0 采集 收起 来源:编程挑战

    2015-04-30

  • 由于a标签属于内联元素,无高度和宽度属性,因此控制鼠标经过状态改变背景颜色时,仅在有文字的地方显示背景颜色。解决的办法是把a标签变为块级元素,display:block
    查看全部
    0 采集 收起 来源:编程练习

    2015-04-30

  • @@--企业网站综合布局实战-第5章 新闻详细页制作 5-1 新闻详细页制作 ①首行缩进text-indent:2em; 2em表示当前两个字符的大小。 px是【绝对单位】 em是【相对单位】,1em的大小是当前1个字体的大小,因此2em正好是两个字符。 ②text-indent的值允许负值,因此如果想隐藏某个div中的文字可以这样写text-indent:-9999px.
    查看全部

举报

0/150
提交
取消
课程须知
1. 您已具备HTML 常用标签和属性。 2. 您已具备CSS 常用属性和值。 3. 您想提升网页布局技能。
老师告诉你能学到什么?
1.CSS中盒子模型的使用 2.网页三列布局方法 3.两列自适应高度布局方法 4.幻灯片切换效果的制作方法 5.导航菜单的制作方法

微信扫码,参与3人拼团

意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!