CSS布局与传统表格(table)布局最大的区别在于：原来的定位都是采用表格，通过表格的间距或者用无色透明的GIF图片来控制文布局版块的间距；而现在则采用层(div)来定位，通过层的margin,padding,border等属性来控制版块的间距。 1.定义DIV分析一个典型的定义div例子：#sample{ MARGIN: 10px 10px 10px 10px;PADDING:20px 10px 10px 20px; BORDER-RIGHT: #CCC 2px solid;BORDER-BOTTOM: #CCC 2px solid;BORDER-LEFT: #CCC 2px solid;B...
接下来开始要真正设计布局了。和传统的方法一样，你首先要在脑海里有大致的轮廓构想，然后用photoshop把它画出来。你可能看到有关web标准的站点大都很朴素，因为web标准更关注结构和内容，实际上它与网页的美观没有根本冲突，你想怎么设计就怎么设计，用传统表格方法实现的布局，用DIV也可以实现。技术有一个成熟的过程，把DIV看成和TABLE一样的工具，如何运用就看你的想象力了。注：在实际应用过程中，DIV在有些地方的确不如表格方...
写在前面：本文简单介绍一下css的三大特性：层叠性、继承性、优先级。以及margin,padding,浮动，定位几个知识点。限于水平，不深入探讨，仅作为学习总结。1，三特性 1）层叠性：同标签同权重下，样式冲突，后面的样式会覆盖前面的。 2）继承性： 给父元素设置样式的时候，子元素在默认没有样式的情况下会受父元素的样式影响。注意宽高不能继承。可继承的属性： ◇文字颜色可以被继承 <span style="font-family: "Times New Roman...
CSS Reset 是革命党，CSS Reset 里最激进那一派提倡不管你小子有用没用，通通给我脱了那身衣服，凭什么你 body 出生就穿一圈 margin，凭什么你姓 h 的比别人吃得胖，凭什么你 ul 戴一胳膊珠子。于是 *{margin:0;} 等等运动，把人家全拍扁了。看似是众生平等了，实则是浪费了资源又占不到便宜，有求于人家的时候还得贱贱地给加回去，实在需要人家的默认样式了怎么办？人家锅都扔炉子里烧了，自己看着办吧。 也就是Reset 相对「暴力」...
html第一节 /*为div标签设置CSS样式*/ /*div{ background-color: yellow; width: 300px; height:100px; }*/ /*.name 获取class名为name的标签*/ .div1{ width: 500px; height: 100px; background-color: yellow; } .div2{ width: 300px; height: 50px; background-color: red; } 1.单标签 2.双标签 区分：看是否有内容部分，如果有，则是双标签，反之，是单标签 例如：和 跳转到百度...
一直以来非常庆幸曾经有翻过《代码大全2》；这使我崎岖编程之路少了很多不必要的坎坷。它在软件工艺的话题中有写到一篇：“首先是为人写程序，其次才是机器(Write Programs for People First, Computers Second)”。虽然这是针对代码可读性来谈及的，但这间接昭示了开发效率之重要不是？此次以 Vue , Es6, Jade, Scss , Webpack, Gulp等一套强大组合来改善团队前端工作流，首因即出于这个理念。 Vue ES6 Jade Scss Webpa...
今日学习终于到了css，css可以实现很多表现出很酷的界面，而css的出现是为了解决 HTML结构上写样式出现一片混乱现象而应运而生的语言，在以前样式都是和结构一起写的， 不分彼此，而这样大大增加了代码量，因为一个同样的样式不断重复，只能不断重新写出 来，还有也让代码写完后困难阅读，查找错误也变得无比艰辛，而这个时候css出现了，并 体现出了它的好处，而它的好处就是把上面的问题解决了，把结构与表现分离开来。 接下说说什...
一、理解web标准含义--为什么采用web标准*****将内容与样式分离1、web标准是一系列标准，就是一系列技术标准在使用时，是组合应用【1】、结构化内容 html【2】、表现化内容 css【3】、行为化内容 JavaScript2、网页开发的小工具--火狐浏览器中的firebug工具--附加组件--搜索firebug作为web前端工作，要兼容的浏览器ie，火狐浏览器，谷歌刘浏览器，苹果浏览器等。网页是否有css样式，测试--在浏览器改变文字大小。3、css定义技巧：【...
一、在实际工作中，都是一个团队在做项目，不是一个人在工作。多人协作，就是每个团队都有自己 的命名习惯。1、css选择符命名，规范。2、都有命名规范文档。 二、css选择符作用：指定css样式所作用对象（范围）1、标签选择符：针对html标签2、id选择符：针对页面中只出现一次的内容，id3、类选择符：针对某些元素，相同的样式，重复样式*****默认情况下某些html元素本身有自己的默认值。4、控制所有元素----使用通配符----*通配选择...
一、学习心得---参考优秀的网页来学习。 1我们只做的静态网页主要用的技术？html+css 只要网上看到的，他的源代码公开的。【1】、先去分析，他们页面是如何布局（结构化）【2】、再试着去做一下，---模仿过程。【3】、最后我们可以自己尝试创新---通向高手的过程。 css精灵技巧，优化网页的http请求次数，提高网页的效率。*****css精灵的核心思想，就是将多张图片，合成一张图片，然后通过背景属性中的定位来控制到底显示图片中的哪...
在网页制作中，有许多的术语，例如： CSS、 HTML、 DHTML、 XHTML等等。在下面的文章中我们将会用到一些有关于 HTML的基本知识，而在你学习这篇入门教程之前，请确定你已经具有了一定的 HTML基础。下面我们就开始一步一步使用 CSS+DIV进行网页布局设计吧。 所有的设计第一步就是构思，构思好了，一般来说还需要用PhotoShop或FireWorks(以下简称PS或FW)等图片处理软件将需要制作的界面布局简单的构画出来，以下是我构思好...
CSS设计彻底研究第1章笔记 XHTML与HTML的重要区别 1. 在XHTML中标记名称必须小写 2. 在XHTML中属性名称必须小写 3. 在XHTML中标记必须严格严格嵌套 4. 在XHTML中标记必须封闭 5. 在XHTML中，即使是空元素的标记也必须封闭 6. 在XHTML中属性值用双引号括起来 7. 在XHTML中属性值必须使用完整形式 8. 在XHTML中，应该区分“内容标记”与“结构标记” 在HTML中引入CSS的方法 1.行内式 This is a line of Text. ...
第 1 课 页面布局与规划 在网页制作中，有许多的术语，例如：CSS、HTML、DHTML、XHTML等等。在下面的文章中我们将会用到一些有关于HTML的基本知识，而在你学习这篇入门教程之前，请确定你已经具有了一定的HTML基础。下面我们就开始一步一步使用DIV+CSS进行网页布局设计吧。 所有的设计第一步就是构思，构思好了，一般来说还需要用PhotoShop或FireWorks(以下简称PS或FW)等图片处理软件将需要制作的界面布局简单的构画出来，以...
CSS专用书写工具： TopStyle Pro v3.11 官方网站地址：http://www.bradsoft.com/ 功能专注于CSS设计的辅助工具，功能相当多，附有CSS码检查功能，减少写错的机会。尤其是它的HELP文件中详细的CSS指令介绍，很适于用作参考文件与初次接触CSS的人做为学习使用。最有用的功能为CSS排错检查，可以对各个版本的CSS文件进行标准化排查并对其进行书写格式化！ [PS:最新的TopStyle版本为V3.12英文版，可升级] CSS是Cascading Sty...
页面布局与规划 在网页制作中，有许多的术语，例如：CSS、HTML、DHTML、XHTML等等。在下面的文章中我们将会用到一些有关于HTML的基本知识，而在你学习这篇入门教程之前，请确定你已经具有了一定的HTML基础。下面我们就开始一步一步使用DIV+CSS进行网页布局设计吧。 所有的设计第一步就是构思，构思好了，一般来说还需要用PhotoShop或FireWorks(以下简称PS或FW)等图片处理软件将需要制作的界面布局简单的构画出来，以下是我构思好的...