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

企业网站综合布局实战

zkpplpp PHP开发工程师
难度初级
时长 2小时55分
学习人数
综合评分9.73
544人评价 查看评价
9.8 内容实用
9.8 简洁易懂
9.6 逻辑清晰
li{
float:left;
width:50px;
height:30px;
list-style: none;
}
li a{
display:block;
text-align: center;
line-height: 30px;
}
a:link,a:visited{
color:black;
text-decoration: none;
}
a:hover,a:active{
color:white;
text-decoration: none;
background: #BE3948; }
一个html5和CSS样式就这样装逼,你是真的有多搞笑
如果用list-style-position:inside;list-style-image这种方法,图片会替换原来的小圆点。
但是因为小圆点处于文字中线的位置,会使得文字位置向下便宜一些,导致跟日期对齐效果差。
所以还是用老师的方法视觉效果好一些。
为什么这么多人给第一个评论点赞。。。<li>的位置都错了
一直让我觉得神奇的一点是,老师尽管用了很多浮动布局,但显式的清楚浮动只有一处,而且效果完全一样。让习惯于浮动后就clearfix的我 惊呆了。另外在课程里学习了myfocus 轮播图库的使用,以及怎样设计代码以尽量实现代码的复用 加快开发,减少代码量。
<h1>【有奖活动】给父亲的三行书信</h1>

<p>发布人:Admin 发布时间:2014-08-01 浏览:5321次</p>

<div class="list_box_newscontent">

<p>
父亲这个角色,一直给人的印象都是不善言辞、默默守护。
为了你和这个家付出了很多很多。也许从前的你太过年少,
说不出对父亲的肉麻感谢,也许现在的你,已为人父母,能
切身体会得到父爱的伟大。那么,正值父亲节来临之际,对
于深爱你的父亲,请勇敢的表达出你对他的爱吧
</p>
这里要说下: 上面老师给的网址,或百度到的myfocus官网已经不能用了,因为这个项目原来是托管在googlecode上的,但是googlecode已经停止服务了(被github打败了)。

所以项目要到github上找,百度: myfocus github就能找到。 或者试下这个地址:

http://koen301.github.io/myfocus/
可以把myfocus看成一个造好的轮子, 除了没有html结构外与组件没有差别,关键只需要小白操作。
谢谢老师!
多谢各位的文字,为咋们节省了不少时间!
卧槽 这也太方便了。 其实只要引入myfocus.js库 把它的 pattern 开动就可以了
<ul>
<li><a href="#">品牌故事</a></li>
<li><a href="#">联系我们</a></li>
<li><a href="#">加入我们</a></li>
<li><a href="#">版权声明</a></li>
</ul>
.newsTitle{
font-size:18px;text-align:center;
}
.newsInfo{
font-size:14px;font:"微软雅黑";
color:#E8E8E8;
text-align:center;
border-bottom:1px solid #E8E8E8;
}
.newsContent{
line-height:25px;
font-size:14px;
text-indent:2em;
}
.newsContent p img{
display:block;
margin:0 auto;
}
(1)在线代码测试工具:http://www.lvyestudy.com/tools/run_code.aspx;
(2)在线调色板:http://www.lvyestudy.com/tools/color_picker.aspx;
(3)CSS3圆角生成器:http://www.lvyestudy.com/tools/border_radius.aspx
课程须知
1. 您已具备HTML 常用标签和属性。 2. 您已具备CSS 常用属性和值。 3. 您想提升网页布局技能。
老师告诉你能学到什么?
1.CSS中盒子模型的使用 2.网页三列布局方法 3.两列自适应高度布局方法 4.幻灯片切换效果的制作方法 5.导航菜单的制作方法

微信扫码,参与3人拼团

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

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

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?

举报

0/150
提交
取消