关于css的基本知识（css相关知识）

css布局的几个知识点

inline-block布局可以使用inline-block布局，但要注意一些事情。（1）vertical-align属性会影响到inline-block元素，你可能会把它的值设置为top；（2）需要设置每一列的宽度；（3）如果HTML源代码中元素之间有空格，那么列与列之间会产生空隙 盒子模型 有两种很重要的盒子模型，分别是ie盒子模型和w3c盒子模型。

布局属性的演变与核心理解从最早的CSS1时代，table布局曾是主流，随后是float的兴起，它解决了多列布局的需求，让块级元素能轻松换行。inline-block的出现，虽然晚于float，但提供了更多灵活性。CSS3引入了flex和grid，它们不仅革新了布局方式，而且在现代网页中占据了主导地位，取代了float的大部分应用场景。

少用偏门。类似break-word断行，z-index手动分层，还有像垂直对齐等等这些偏门CSS最好少用，因为不一定所有浏览器都支持，而且极难通过W3C检测。 center不是float的值。很多新手都会把center误认为是float的值，而偏偏不是如此。center只是text-align的值。 对齐不能包括两个值。

含有定位属性的元素，其top、bottom单位为百分比时，该百分比是相对于父元素的高度的。同理，left、right则是相对于父元素的宽度的。边框宽度不允许使用百分比值。这点就不解释了。

position：absolute；top：50px；right：50px 上面的CSS设置一个元素的位置从浏览器的顶部和右边保持50px。你也可以在div内使用绝对定位。覆盖所有样式 写CSS的时候都应该知道，当你想给一个元素添加一个新的CSS样式，但这个样式之前已经被定义过了。此时我们可以采用！important来定义。

Web前端新手应该知道的CSS长度单位

1、在写css的时候最常用的长度单位是px（像素），经常看到的还有em，pt等等，其实css中的长度单位一共有8个，分别是px，em，pt，ex， pc ，in，mm，cm。px：像素（Pixel），相对于设备的长度单位，像素是相对于 显示器 屏幕分辨率而言的。譬如，WONDOWS的用户所使用的分辨率一般是96像素/英寸。

2、注意1：任意浏览器的默认字体高都是16px，如果给body元素的font-size设置为65%，那body的font-size实际大小是 16px*65%=10px，如果所有子元素都以该字体大小使用em作为尺寸单位，相当于1em=10px，这样设置em就非常简单，只要将实际px数值除以10，就是em单位值。

3、绝对长度单位 Absolute Length Units pt CSS1 IE3+ ， NS4+ 点（Point）pc CSS1 IE3+ ， NS4+ 派卡（Pica）。

4、px像素，相对长度单位。像素px是相对显示器屏幕分辨率而言的。用于元素的边框或者定位。em是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被设置，则相对浏览器的默认字体尺寸。

Web前端工程师要了解的html+css基础知识

1、web前端开发主要学习以下内容：HTML：学习HTML标记语言，它是用于构建网页内容的基本语言。CSS：学习CSS（层叠样式表），用于样式和布局网页元素。JavaScript：学习JavaScript语言，它是一种高级编程语言，用于创建交互式网页和动态Web应用程序。响应式Web设计：学习如何创建可以适应不同屏幕大小和设备的网页。

2、web前端需要学习HTML、CSS和JavaScript等。【点击测试我适不适合学设计】 HTML的全称为超文本标记语言，是一种标记语言。它包括一系列标签．通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。

3、对于零基础小白，首先要掌握的是前端开发的基础知识，相关的程序语言；HTML、CSS、JavaScript，三者都是基础语言，代码简单，容易上手，熟能生巧，只要勤于练习，很快就能学会。在页面的布局时，HTML将元素进行定义，CSS对展示的元素进行定位，再通过JavaScript实现相应的效果和交互。

4、知识点：Web前端开发环境，HTML常用标签，表单元素，Table布局，CSS样式表，DIV+CSS布局。熟练运用HTML和CSS样式属性完成页面的布局和美化，能够仿制任意网站的前端页面实现。CSS3选择器、伪类、过渡、变换、动画、字体图标、弹性盒模型、响应式布局、移动端。