PHP学习第八天——div与class和id

前天做唯品会的网页,直接导致我积攒了许多天十分膨胀的自信心崩碎成了一片一片的渣渣,div的嵌套并不能处理所有的布局与格式,例如:

<div><div><div><<div></div>/div></div></div>,网页body本身的大小会使得div出现溢出的状况,float等许多标签会直接对div失去作用,并且在格式上,也显得很不流畅,因此,怎样为一个网页布局,怎样避免各种div相互嵌套而导致溢出的情况发生,是制作一个成品网页的重中之重。

今天成功做完了唯品会的网页,现将一部分代码粘贴如下:

<div id="main">

<div class="tou">

<!--网页的上半部分-->

<div class="zuoshang">

<a id="dl" href=""><h1 >唯品会</h1></a>

<a id="xl" href="">一家专门做特卖的网站</a>

</div>

<div class="youshang">

</div>

</div>

<!--网页的中央-->

<div id="mid">

<!-- 左半部分 -->

<div class="left"></div>

<!-- 右半部分 -->

<div class="right">

<div id="xiaozi">

<div class="text1">欢迎注册</div>

<div class="text2">已注册可<a class="fen" href="./denglu.html">直接登录</a></div>

依然是许多的div相互嵌套,但在div中加入class与id,使用外部样式,可以使整个代码页的长度缩短许多,因为很多情况下样式甚至要比body还要多,这样的布局,整个代码页看起来会十分明了,在今后做修改的时候,也会更加的轻松方便。

给密密麻麻的众多div中加入注释,会起到很好的作用。

时间: 2024-09-30 19:21:15

PHP学习第八天——div与class和id的相关文章

九、Android学习第八天——广播机制与WIFI网络操作(转)

(转自:http://wenku.baidu.com/view/af39b3164431b90d6c85c72f.html) 九.Android学习第八天——广播机制与WIFI网络操作 今天熟悉了Android中的广播机制与WIFI网络的一些基本操作,总结如下: Android的广播机制 我们知道广播机制中,发送方不会关心接收方时候接收到数据或者如何去处理数据. 这里总结下Android中BroadcastReceiver的注册方法: (一)在应用程序中进行注册 (二)在Manifest.xml

2016/2/24 1,css有几种引入方式 2,div除了可以声明id来控制,还可以声明什么控制? 3,如何让2个div,并排显示。

1,css有几种引入方式 使用HTML标签的STYLE属性 将STYLE属性直接加在单个的HTML元素标签上,控制HTML标签的表现样式.这种引入CSS的方式是分散灵活方便,但缺乏整体性和规划性,不利于后期的修改和维护,当需要修改网站的样式时,一个相同的修改可能涉及多个地方,维护成本高.使用STYLE属性的样式效果最强,会覆盖掉其它几种引入方式的相同样式效果.   将样式代码写在页面<STYLE>...</STYLE>标签之中 <STYLE>...</STYLE&

学习笔记找到多个具有相同ID“_header”的控件,FindControl要求控件具有唯一的ID.

private void DisplayHotBooks()    {        //获取所有的书分类信息        IList<Category> list = CategoryManager.GetAllCategories();        int i = 0;        foreach (Category item in list)        {            AccordionPane ap = new AccordionPane();           

python学习第八天

解析库之bs4的基本使用方法 ''' pip install beautifulsoup4#安装bs4 pip install lxml#安装lxml ''' html_doc = """ <html><head><title>The Dormouse's story</title></head> <body> <p class="sister"><b>$37&

11.23linux学习第八天

周六,是老刘讲课第八天了,5.2-5.6, 5.2 文件权限与归属 文件的读.写.执行权限可以简写为rwx,亦可分别用数字4.2.1来表示,文件所有者,所属组及其他用户权限之间无关联,如表5-5所示. 表5-5                                              文件权限的字符与数字表示 图5-1 通过ls命令查看到的文件属性信息 在图5-1中,包含了文件的类型.访问权限.所有者(属主).所属组(属组).占用的磁盘大小.修改时间和文件名称等信息.通过分析可知

IOS 阶段学习第八天笔记(指针)

                                                        IOS学习(C语言)知识点整理 一.指针 1)概念:存储变量的地址的一个变量. 2) 数据存储类型分析 1.text (代码段) :存储二进制的可执行代码 2.data(初始化的数据段) 存储初始化的全局变量以及初始化的static修饰的变量,分为只读数据段 (如:字符串常量,整型常量)及可读可写数据段,静态存储. 3.data(未初始化的数据段)存储未初始化的全局变量及未初始化的st

No_16_0229 Java基础学习第八天

文档版本 开发工具 测试平台 工程名字 日期 作者 备注 V1.0 2016.02.29 lutianfei none 工具类中使用静态帮助文档的制作如何使用帮助文档Math类学习代码块继承继承概述继承的好处Java中继承的特点Java中继承的注意事项什么时候使用继承呢?继承中成员变量的关系super关键字继承中构造方法的关系继承中成员方法的关系方法重写概述方法重写的注意事项练习题 工具类中使用静态 当报错无法从静态上下文中引用非静态 方法xxx: 表明在静态方法中引用了非静态方法 在工具类中当

Java基础学习第八天

应用程序 ------------- 进程 ------------- 1.运行时(runtime)应用程序. 2.进程之间的内存不是共享(独占) 3.进程间通信使用的socket(套接字). 多线程 ------------- 1.同一个进程内并发执行的代码段. 2.线程之间共享内存. 3.创建灵活响应的桌面程序.(带操作界面的程序) 4.每个运行着的线程对应一个stack(栈). 5.应用程序至少有一个线程(主线程) java.lang.Thread   ( Thread 线程类) ----

Ext JS学习第八天 Ext基础之 认识Ext.js 和Ext-more.js

此文来记录学习笔记: •认识Ext.js 和Ext-more.js •首先,我们要知道这2个js文件的作用,这俩个文件包含了Ext的一些基础定义.基本的属性和方法,我们要重点学习和深入底层代码进行研究. •如果所示:API位置 . •Ext.js方法详解: –Ext.apply&Ext.applyIf –Ext.extend –typeOf –isEmpty.isIterable.isFunction.isArray... –Iterate 下面从栗子中看看这些方法是实际使用方法,请看栗子代码吧