朝花夕拾 – DIV+CSS布局实战系列视频教程【Part7 – WRF格式】
侧边栏的内容及其样式设定,这节中关于CSS规则作用的解释稍微简略了一点,但是相信如果认真的学习了之前的教程内容,看懂也是很应该的事情哈哈。当然可以肯定的说,我这里的CSS样式定义并不是最简洁扼要的,更不是唯一的,或者说很多规则也可以用另外的CSS属性来替代。
侧边栏的内容及其样式设定,这节中关于CSS规则作用的解释稍微简略了一点,但是相信如果认真的学习了之前的教程内容,看懂也是很应该的事情哈哈。当然可以肯定的说,我这里的CSS样式定义并不是最简洁扼要的,更不是唯一的,或者说很多规则也可以用另外的CSS属性来替代。
如何设置左栏中列表的外观。事实上学习了导航菜单的样式定义之后,很多东西应该怎么做大家心里都有底了。列表项中的链接元素了,除了设置颜色、去除下划线修饰等基本工作之外,最主要的是每个链接前面的图标修饰。
本教程通过视频讲解如何一步步构建一张DIV+CSS网页,当然是从一张完全空白的网页开始…教程中涉及的图片素材和最终效果仅作一个参考,是否能设计出更美观的作品就要依仗大家自身的平面设计功底了。
在未设定任何CSS的情况下DIV容器在浏览器中是没有任何外观视觉上的呈现的,所以为了更直观的进行布局规划,我们可以先为这些容器添加一些属性,来辅助我们观察它们在浏览器中的尺寸、位置等信息,以便我们进行深入的调整。可以用于辅助的属性有很多,应用最广泛的是边框和背景。
由于不同的浏览器,比如IE6、IE7、IE8、Firefox等对CSS的解析不一样,因此会导致生成的页面效果不一致,得不到我们所需要的页面效果。这个时候我们就需要针对不同的浏览器去写不同的CSS,让它能够同时兼容不同的浏览器,能在不同的浏览器中也能得到我们想要的页面效果。这个针对不同的浏览器写不同的CSS code的过程,就叫CSS hack。
有时候灵活的转换一下思路,很多相同的效果可以用不同的方法实现出来,这对学习和巩固CSS知识是很有帮助的。那么接下来我们就看一下,这种结构的内容元素,怎么利用CSS来调整它的外观样式。
标题、段落、列表、菜单等等,本节教程将针对图片元素的CSS定义展开学习,很多东西只要之前的内容熟练了,理解起来也是非常容易的事情。
学习了导航菜单的样式定义之后,很多东西应该怎么做大家心里都有底了,如果想详细了解CSS对列表元素的外观控制,可以参考一些利用列表制作导航菜单的教程。