目录 什么是HTML语义化？ 为什么要语义化 常用标签的语义 一、什么是HTML语义化？ 简单来讲就是：每个标签做自己的事，使得能够被机器直接读懂。 二、为什么要语义化？ 1、更容易被搜索引擎收录。 2、方便其他类型设备解析（如：屏幕阅读器等） 3、便于团队开发和维护。 三、常用标签的语义 标签 含义 备注 网页标题 用于告诉用...
目录 块级元素 内联元素 内联块级元素 总结 一、块级元素（block） 定义：默认情况下，独占一行的元素就是块级元素。 特点： 每个块级元素都从新的一行开始，并且其后的元素也另起一行。（真霸道，一个块级元素独占一行） 元素的高度、宽度、行高以及顶和底边距都可设置 元素宽度在不设置的情况下，是它本身父容器的100%（和父元素的宽度一致）。 常见的块级元素：、、....
目录 图解 盒模型尺寸基准 使用浏览器的开发者工具，查看元素高(宽)度时，遇到的问题 一、图解 说明：由内而外依次是content、padding（内边距）、border（边框）、margin（外边距）。 举个例子：一个快递车里放了许多快递包裹（盒子包装的），每个包裹里面又放了不同的东西。 content：真正容纳其他东西的区域。比如快递车的content，就是那些包裹所处的那个空间； 而每...
目录 布局模型 流动模型（Flow） 浮动模型 (Float) 层模型（Layer） 颜色值 长度值 一、布局模型 网页布局模型：个人理解，就是对html中各个元素进行一个排列。而排列的方法可以分为三种：流动模型、浮动模型、层模型。 二、流动模型 这是网页默认情况的布局模式。 特征： 块状元素都会在所处的包含元素内自上而下按顺序垂直延伸分布，因为在默认状态下，块状元素的宽度都为10...
10条建议分享：帮助你成为与硅谷工程师一样优秀的程序员 成为一名硅谷的工程师可能是很多中国程序员的梦想。硅谷被公认是目前世界上云集了最多优秀工程师和知名科技公司、创业公司的地方，吸引了全球无数投资者、创业者和工程师的目光。在那里工作的工程师，有着令人羡慕的职业发展前景... TIME : 2016-04-29 阅读详情>> 移动建站十大原则 移动建站十大原则 ...
推荐国内最好的在线翻译平台 众成翻译 原文链接： http://lea.verou.me/2015/12/my-positive-experience-as-a-woman-in-tech/ 虽说身为女性吐槽在技术圈里遇到的性别歧视之类话题能吸引更多的关注度，但是，如果没有人写点正能量的故事，过分消极的画风就会让越来越多的女性远离技术工作。 如果我一开始就被人告知技术领域存在性别歧视，那我很可能会选择别的职业，毕竟我们不可能以一己之力打败成见。而对我来...
英文原文： 20 CSS Tools for Designers and Developers CSS 工具是现今网站开发人员和设计人员使用的最必要和最重要的工具之一。这是因为这些 CSS 工具，可以为开发人员和设计人员简化手头的工作，大大减少 web 开发和设计工作所需的时间。而专业人员还可以在很短的时间跨度内，用一种更高效的执行方式，完成更多的工作。可惜的是，并非所有这些工具都是众所周知的。现在市场上有很多 CSS 工具。每一种工具都有着自己特定的功...
我们都希望能够在我们所做的事情中得到成长，在WEB开发领域，我们花费时间最多的就是编写代码。这可能包括HTML, CSS, JavaScript, PHP, Python, ActionScript或者任何其他你构建WEB站点时选用的语言。 这篇文章中，我们将分享一些实际的步骤，使你可以扩充技能，成为一个更优秀的程序员。我们提出五个不同的生活习惯，它们可以使你在你所从事的领域变得更加优秀。 1. 一个时间段内只专注于一种类型的语言 如果你正在...
Me： 虽然文中说的不都对，有些地方明显有作者自己的不足，比如看看英文在新世纪不应该算个事了，比如有些要求都是在实践中以时间慢慢积累的不是一上来就求全的。 但前端程序员化越来越明显了。 说明时代在进步，公民素质在提高呀。 在知乎看到这篇文章，现在看来做前端开发真的是很累 CSS 不能编程？用 Less 、 Sass 、 Stylus 、甚至直接用 Absurd ，框架除了 Bootstrap 还有很多。 JS 写多了很麻烦...
HTMLHyper Text Markup Language(超文本标记语言)目录 HTML技术点导图网页的组成网页的基本标签图像标签超链接行内元素和块元素块元素：无论内容多少，该元素独占一行行内元素：内容撑开宽度，左右都是行内元素的可以排在一行 列表表格媒体元素网页的简单布局内联框架HTML表单表单初级验证技术点导图网页的组成W3C标准： 结构化标准语言(HTML、XML)表现标准语言(CSS)行为标准(DOM、ECMAScript)网页的基本标签 标题标签：<h1></h1>段...
好程序员web前端教程分享HTML/CSS部分常见面试题。准备参加web前端面试的小伙伴们一起看一看吧，希望对大家有所帮助！ 1、什么是盒子模型? 在网页中，一个元素占有空间的大小由几个部分构成，其中包括元素的内容(content)，元素的内边距(padding)，元素的边框(border)，元素的外边距(margin)四个部分。这四个部分占有的空间中，有的部分可以显示相应的内容，而有的部分只用来分隔相邻的区域或区域。4个部分一起构成了css中元素的盒...
好程序员web前端分享HTML5常见面试题集锦四 1、为什么要初始化CSS样式？ 答案：因为浏览器的兼容问题，不同浏览器对有些标签的默认值是不同的，如果没对CSS初始化往往会出现浏览器之间的页面显示差异。 当然，初始化样式会对SEO有一定的影响，但鱼和熊掌不可兼得，但力求影响最小的情况下初始化。 2、浮动元素引起的问题？ 答案：a. 父元素的高度无法被撑开，影响与父元素同级的元素 b. 与浮动元素同级的非浮动元素会跟随其后 c. 若...
好程序员web前端分享HTML5常见面试题集锦四1、为什么要初始化CSS样式？答案：因为浏览器的兼容问题，不同浏览器对有些标签的默认值是不同的，如果没对CSS初始化往往会出现浏览器之间的页面显示差异。当然，初始化样式会对SEO有一定的影响，但鱼和熊掌不可兼得，但力求影响最小的情况下初始化。2、浮动元素引起的问题？答案：a. 父元素的高度无法被撑开，影响与父元素同级的元素b. 与浮动元素同级的非浮动元素会跟随其后c. 若非第一...
好程序员web前端分享HTML5常见面试题集锦第二篇，希望对大家有所帮助。 1. <div class="parent"><div class="child"></div></div>,父元素和子元素宽高不固定，如何实现水平垂直居中。方法1：<style type="text/css">html,body{height: 100%;}body{ margin: 0;display: flex; justify-content: center; align-items: center; }.parent{ display: flex; justify-content: center; align-items: center;}</style>方法2：html,body{hei...
好程序员web前端学习路线分享HTML5常见面试题集锦，接下来将会持续为大家分享几篇HTML5常见面试题。1.布局 左边20% 中间自适应 右边200px 不能用定位答案：圣杯布局/双飞翼布局或者flex 2.什么叫优雅降级和渐进增强？渐进增强 progressive enhancement：针对低版本浏览器进行构建页面，保证最基本的功能，然后再针对高级浏览器进行效果、交互等改进和追加功能达到更好的用户体验。优雅降级 graceful degradation：一开始就构建完整...