`

CSS+DIV实现的页面优化代码

阅读更多
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>敲代码很累的留个言吧</title>
<style>
   div#mid { margin: 0px 20px; background:#dfe6ef; font-size:9pt; width:600px;}
   p { padding:5px 10px; margin:2px;}
   div.rtop { display:block; background:white;}
   div.rtop div { display:block; height:1px; overflow:hidden; background:#dfe6ef;}
   div.r1 { margin:0 3px;}
   div.r2 { margin:0 2px;}
   div.r3 { margin:0 1px;}
   div.rtop div.r4 { margin:0 1px; height:1px;}
   .span { text-align:center;}
</style>
</head>

<body>
<div id="mid">
<div class="rtop">
    <div class="r1"></div>
        <div class="r2"></div>
        <div class="r3"></div>
        <div class="r4"></div>
    </div>
            <p class="span"><strong>我爱喝稀粥</strong></p><br />

<p>在我的祖籍河北省南皮县,和河北的其他许多地区一样,人们差不多顿顿饭都要喝稀粥。甚至在米饭炒菜之后,按道理是应该喝点汤的,我们河北人也常常是喝粥。
</p>
<p> 家乡人最常喝的是"黏粥",即玉米面或玉米 子熬的糊糊。乡亲们称做这种粥为" ",他们说" 锅黏粥",而不说什么"熬一锅粥"。新下来的玉米,有时候加上红薯,饭后喝上两碗,一可以补足尚未完全充实饱满的胃,二可以提供进餐时需要摄入的水分(那时候我们进餐的时候可没有什么饮料啊--没有啤酒可乐,也没有冰水矿泉水),三可以替代水果甜食冰激凌,为一顿饭收收尾,做做总结,把嘴里的咸、腥、油腻、酸、辣(如果有的话)味去一去,为一顿饭打上个句号。
</p><p>
喝稀粥的时候一般总要就一点老腌萝卜之类的咸菜。咸菜与稀粥是互相提味、互相促进、相得益彰的,这一点无须多说。吃惯了这种搭配,即使吃白米粥、糯米粥、牛奶麦片粥、燕窝粥、海鲜粥,如我后来有幸吃过的那样,也常常不能忘情于老腌萝卜、云南大头菜或者四川榨菜,还有天源酱园、六必居、保定"春不老"的名牌特制酱菜。咸菜也是不断发展丰富提高的,常吃稀粥咸菜也罢,食者是完全用不着气馁的。
</p><p>
也有属于甜点性质的粥:赤豆汤,八宝莲子粥,板栗、杏仁、花生做的羹食等等。就不就咸菜,则无一定之规了。
</p><p>
粥喝得多、喝得久了,自然也就有了感情。粥好消化,一有病就想喝粥,特别是大米粥。新鲜的大米的香味似乎意味着一种疗养,一种悠闲,一种软弱中的平静,一种心平气和的对于恢复健康的期待和信心。新鲜的米粥的香味似乎意味着对于病弱的肠胃的抚慰和温存。干脆说,大米粥本身就传递着一种伤感的温馨,一种童年的回忆,一种对于人类幼小和软弱的理解和同情,一种和平及与世无争的善良退让。大米粥还是一种药,能去瘟毒、补元气、舒肝养脾、安神止惊、防风败火、寡欲清心。大鱼大肉大虾大蛋糕大曲老窖都有令人起腻、令人吃勿消的时候,然而大米粥经得住考验而永存。
</p>

    <div class="rtop">
        <div class="r4"></div>
        <div class="r3"></div>
        <div class="r2"></div>
        <div class="r1"></div>
    </div>
</div>
</body>
</html>
分享到:
评论

相关推荐

    css+div网页模板整站

    CSS+Div布局的优势在于其灵活性和可维护性,使得网页结构清晰,代码更易于管理和修改。这种布局方式相比传统的表格布局,能更好地实现响应式设计,适应不同设备的屏幕尺寸。 Div元素,全称为“division”,即分区,...

    精美css+div网站实例源码

    6. **JavaScript交互**: 虽然主要标签是CSS和div,但源码可能也包含了JavaScript代码,用于实现动态效果和用户交互,比如导航菜单的展开折叠、图片轮播等。 7. **Web标准和最佳实践**: 学习这些源码时,可以观察...

    css+div 实例全程教学代码!

    使用div配合CSS,我们可以实现响应式设计、浮动布局、网格系统等多种复杂的页面布局模式。 在"css+div 实例全程教学代码"中,你可能遇到以下知识点: 1. **选择器**:CSS选择器是匹配HTML元素的方式,如类选择器...

    精通CSS+DIV 书中实例和源代码

    《精通CSS+DIV》是一本深入探讨网页样式与布局技术的专业书籍,其核心内容围绕着如何利用CSS(层叠样式表)和DIV(定义文档结构的HTML元素)来实现高效、美观的网页设计。这本书提供了5个完整的网站设计案例,通过...

    css+div+js实现简单导航栏菜单栏

    为了优化代码结构,通常会将CSS和JS代码分离到单独的文件中,以提高可维护性和复用性。 总的来说,"CSS+Div+JS实现简单导航栏菜单栏"这个主题涵盖了网页设计的基础知识,包括使用CSS美化和布局,用Div组织结构,...

    CSS+DIV和JS特效代码

    "CSS+DIV和JS特效代码"这个主题涵盖了一系列用于增强网页视觉效果和用户体验的代码片段。 CSS是用于描述HTML或XML(包括SVG、MathML等各种XML方言)文档样式的语言。通过使用CSS,我们可以将样式与内容分离,使页面...

    用CSS+DIV做的网上书店模板

    7. **CSS预处理器**:如Sass和Less,它们扩展了CSS的功能,允许变量、嵌套规则、混合(mixins)等功能,提高了CSS代码的可维护性和复用性。 8. **CSS性能优化**:减少选择器的复杂性,合理使用内联样式、内部样式表和...

    CSS+DIV详解网站好帮手

    8. **性能优化**:讨论了CSS性能优化策略,如减少重绘和回流、合理组织样式代码、利用浏览器缓存等。 9. **实战案例**:提供了一系列实际的网页布局示例,帮助读者理解并应用所学知识。 《CSS+DIV文档》这个压缩包...

    jsp css+div 后台框架

    这种框架结合了JavaServer Pages(JSP)、Cascading Style Sheets (CSS) 和 Div布局,以实现动态网页设计和管理。下面我们将详细探讨这三个主要组成部分及其在构建后台框架中的作用。 1. JavaServer Pages (JSP): ...

    css+div模板技术

    1. 布局控制:通过CSS+Div,我们可以实现流式布局、网格布局、响应式布局等多种复杂的页面结构。Div元素作为布局的基本单元,通过CSS设置其宽度、高度、边距、浮动等属性,可以灵活调整元素的位置和大小。 2. 样式...

    html+css+div学习实例教程

    5. **性能优化**:精简的HTML和CSS代码能提高页面加载速度,提升用户体验。 6. **模块化**:使用CSS预处理器(如Sass、Less)和CSS框架(如Bootstrap、Foundation),可以实现代码复用,提高开发效率。 在本教程中...

    精通CSS+DIV网页样式与布局源代码

    本资源"精通CSS+DIV网页样式与布局源代码"提供了深入理解和掌握这两种技术的宝贵资料,旨在帮助开发者实现优雅、灵活且响应式的网页设计。 CSS是一种样式表语言,用于描述HTML或XML(包括SVG、MathML等各种XML方言...

    《CSS+DIV网页样式与布局》源码

    - **优化与性能**:了解如何编写高效CSS,避免冗余代码,优化加载速度和减少内存占用。 综上所述,《CSS+DIV网页样式与布局》的源码涵盖了CSS和HTML布局的核心知识点,通过实际的代码示例,读者可以深入理解并掌握...

    css+div (10套网站模板)完整网站模板

    - 如何优化CSS代码,提高网页加载速度。 总的来说,"css+div (10套网站模板)"是一份宝贵的教育资源,无论是初学者还是有经验的开发者,都能从中受益,进一步提升CSS+Div的使用技巧,构建出更加精美、功能丰富的网站...

    CSS+DIV网页布局实例40例.rar

    3. **易扩展性**:使用CSS+DIV布局,可以轻松添加或删除页面元素,不影响整体结构。 4. **性能优化**:通过精简代码和合理定位,可以提高网页加载速度。 四、实例详解 40个实例覆盖了以下常见布局模式: 1. **基本...

    网页设计-页面布局篇(Css+Div)

    **标题与描述**:本教程聚焦于网页设计中的关键环节——页面布局,并详细介绍了如何运用CSS和Div技术来构建网页的基本结构。 **重要性**:网页设计是网络开发的重要组成部分之一,良好的页面布局不仅能够提升用户...

    css+div模板

    初学者可以通过查看和分析这些模板的HTML代码和CSS样式,理解如何使用Div和CSS实现各种布局效果。例如,007可能是响应式布局的示例,而006可能是传统的流式布局。通过对这些模板的实践和拆解,可以加深对CSS选择器、...

    欧美风petshop的css+div页面

    【标题】:“欧美风petshop的css...总的来说,"欧美风petshop的css+div页面"是一个结合了技术与设计的艺术品,通过CSS和HTML的巧妙运用,实现了既美观又实用的网页,充分展示了CSS+div在网页设计中的强大功能和灵活性。

    css+div网页样式与布局案例指导

    div元素可以通过class或id选择器与其他CSS规则结合,实现定制化的样式效果。 本书《CSS+Div网页样式与布局案例指导》将理论与实践相结合,提供了一系列实际的案例,涵盖了以下核心知识点: 1. **基础样式应用**:...

    Table2CSS表格转CSS+DIV布局工具

    “表格”是转换的对象,HTML表格在网页设计中常见但有时不利于页面优化;“CSS+DIV”是转换的目标,这种布局方式更符合现代网页设计的标准;“布局工具”则点明了软件的性质,是一种辅助设计工具,用于改善网页布局...

Global site tag (gtag.js) - Google Analytics