CSS入门(一)

文/小棉袄

图/网络

DIV+CSS开山篇

div+css开山篇

一、div+css(Cascading Style Sheet(层叠样式表)的缩写)简介

传统页面table布局和显示数据

缺点

1.显示样式和数据是绑定在一起的

2.布局的时候灵活度不高

3.一个页面可能会有大量的元素,代码就会冗余

4.增加带宽

5.搜索引擎不喜欢这样的布局

优点

1.理解比较简单

2.不同的浏览器看到的效果一般是相同的

3.显示数据还是很好的

div+css是什么

div+css是一种目前比较流行的网页布局技术,div来存放需要显示的数据(文字,图表)。Css用来指定怎样显示,从而做到数据和显示相分离的效果。

简单的理解

Div是用来存放内容(文字图片,元素)的容器

Css是用于指定div中的内容如何显示,包括这些内容的位置和外观

入门案例

div+css的优势

网页设计三个历史时期

Table,table+css,div+css

①table网页设计:内容和样式(外观和布局)混合

②table+css网页设计:table布局,css指定外观

③div+css网页设计:div防内容,css指定样式(外观和布局),内容和样式彻底分离

优势

①符合w3c标准,微软等公司均为w3c支持者

②搜索引擎更加友好

③样式的调整更加方便

④css的极大优势表现在简洁的代码

⑤表现和结构分离,在团队开发中更容易分工合作而减少相互关联性。

注:div+css并不是要我们抛弃table,因为table在显示数据时,特别方便,因此在使用div+css时,该使用table时就得使用。

笔记相关课程视频链接

https://pan.baidu.com/s/1YKVpCAmahCQ19FzffBeTmw?from=singlemessage

(复制链接打开)

如链接失效可添加管理员微信(121718536)备注PHP自学者获取

关于小棉袄

小棉袄是妈妈取得

PHP小白一枚,一个还有一年毕业的大三狗,每天分享自己的自学笔记,希望有朝一日可以敲出自己的源代码。

欢迎所有对PHP感兴趣的朋友加入PHP自学者阵营。

期待与PHP界大佬做朋友(等待传授经验ing)。

本公众号纯属公益(个人兴趣),没有任何商业合作,欢迎投稿。

  • 发表于:
  • 原文链接:https://kuaibao.qq.com/s/20180526G09C2900?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。

扫码关注云+社区

领取腾讯云代金券