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

企业网站综合布局实战

zkpplpp PHP开发工程师
难度初级
时长 2小时55分
学习人数
综合评分9.73
544人评价 查看评价
9.8 内容实用
9.8 简洁易懂
9.6 逻辑清晰
  • margin:0 auto;给一个div设置宽度,并且把左右间距设为自动,可以让一个div在页面中居中
    查看全部
  • 水平重复:repeat-x
    查看全部
  • 想让一行文字在一个盒子中垂直居中,可以让盒子的行高设置为与盒子的高度相同,可实现盒子中文字在盒子中居住
    查看全部
  • 为了解决IE6不支持min-height问题,采用css hack方式书写_height来解决min-height问题。 记得外层盒子也要min-height才能兼容所有模式。
    查看全部
  • 初始化ID与图片列表最外层ID一致
    查看全部
  • 图片居中展现: img{display:block;margin:0 auto;}
    查看全部
    0 采集 收起 来源:编程练习

    2015-04-18

  • text-indent用来规定文本块中首行文本的缩进。em是相对单位,1em的大小是当前1个字体的大小,因此2em正好是两个字符。text-indent的值允许负值,因此如果想隐藏某个div中的文字可以这样写text-indent:-9999px.
    查看全部
    0 采集 收起 来源:练习题

    2015-03-09

  • display:inline-block;将对象呈递为内联对象,但是对象的内容作为块对象呈递。旁边的内联对象会被呈递在同一行内,允许空格。(准确地说,应用此特性的元素呈现为内联对象,周围元素保持在同一行,但可以设置宽度和高度地块元素的属性
    查看全部
  • <style type="text/css"> /*在此定义相关CSS样式*/ *{margin:0;padding:0;} body{font-size:14px;} .topList{width:350px; height:180px; margin:20px auto;border:1px solid #E8E8E8;} .topList ul{list-style-type:none;padding:5px 5px 5px 10px;} a{text-decoration: none;color:#333;} .topList li a:link,.topList li a:visited{color:#000;} .topList li a:hover,.topList li a:ACTIVE{color:#c00;} em{width:20px;height:16px;text-align:center;color:#333;font-style:normal;display:block;background:url(http://img1.sycdn.imooc.com//53cf0fa20001d3dc00200032.jpg) no-repeat 0 -16px;float:left;line-height:16px; margin-top:2px;} .top em{background:url(http://img1.sycdn.imooc.com//53cf0fa20001d3dc00200032.jpg) no-repeat 0 0px;color:#fff} li{list-style:none;height:30px;line-height:20px;} </style>
    查看全部
    0 采集 收起 来源:编程练习

    2018-03-22

  • vertical-align:middle 垂直方向居中
    查看全部
  • 【MyFocus】:【焦点图插件】 开源免费,专注于焦点图的JS库,小巧,完全独立的JS库,运行效率高,多风格,相同接口,丰富的API 【网址】:http://demo.jb51.net/js/myfocus/download.html#p5 <script src="js/myfocus-2.0.1.min.js" type="text/javascript"></script> <script src="js/mf-pattern/【mF_YSlider.js】" type="text/javascript"></script> <link href="js/mf-pattern/【mF_YSlider.css】" rel="stylesheet" type="text/css"/> --------------------------------------- <div class="ad" 【id="picBox"】><!--必须有个div的id为“picBox”--> --------------------------------------- 调用myFocus插件: <script type="text/javascript"> myFocus({ id:'picBox'})------------------------id与之前定的div的id一致 </script> myFocus使用引入myfocus在引入相应风格的js最后引入对应的样式表;需要通过ID来调用myfocus中的方法。 焦点图制作,使用myFocus脚本要注意的两点: 1.焦点图初始化的ID与图片列表最外层的ID一致 2.图片列表外面,包裹一个class为pic的div 经实践 .ad{height:310px; overflow:hidden;} ,该写法只有IE正常显示,火狐和谷歌浏览器会出现问题。 解决办法:增加 clear:both; 属性
    查看全部
  • 【图片居中:】 img{ **display:block; margin:0 auto; }
    查看全部
    0 采集 收起 来源:编程练习

    2015-03-08

  • 页码HTML+CSS
    查看全部
    0 采集 收起 来源:编程练习

    2015-03-08

  • 盒子页面
    查看全部
    0 采集 收起 来源:盒子模型

    2015-03-08

  • 1、让图片与文本居中对齐,可将图片的对齐方式改为居中对齐(亦可直接设置display:inline;),即:vertical-align:middle;; 2,font-family 选择字体。 3、让特殊文本不跳行,需要使用内联标签,如:<span>;
    查看全部

举报

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

微信扫码,参与3人拼团

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

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