来黑马培训的这一个月可是学到了不少技术，虽然时间很短且是基础班，但是不得不说3个字，黑马牛逼。那么下面就讲一讲关于web前端，HTML及css的一些小知识吧。
web标准的组成部分
1、结构标准（HTML）
2、表现标准（CSS样式）
3、行为标准（javascript）
关于HTML的概念
1、HTML是超文本标记语言，不是编程语言；
2、用HTML标签来描述网页元素，比如：链接、图片、文字等；
3、我们需要将所有的标签放在尖括号“<>” 里面
图片的常见属性
src        属性值 --- url      图像路径
alt        属性值 --- 自定义文本    图像不能正常显示的时候替换文本；
title       属性值 --- 自定义文本    鼠标移入图片显示提示文本；
width     属性值 --- 自定义数值    设置图片的宽度；
height    属性值 --- 自定义数值    设置图片的高度；
列表
无序列表、有序列表、自定义列表（项目列表）


input文本控件
所有的input控件都是通过更改type的取值不同实现不同的效果；
文本框：input的type取值为text    <input type=“text” />
可以设置value属性设置默认的值，<input type=“text”  value=“默认值” />
密码框：input的type取值为password   <input type=“password” />
单选按钮：type=“radio” ,想要实现单选效果我们需要给input标签设置相同的name进行设置归为一类；                  <input type="radio" name="sex">
复选按钮：type=“checkbox”，也可以设置同样的name名称，但是 不会影响多选的效果；                             <input type="checkbox" >
注意：如果想要实现单选按钮和复选按钮默认选中效果我们就需要设置对应的属性checked=“checked”
单选按钮   <input type="radio" checked="checked“  >
文档查询
W3C :   http://www.w3school.com.cn/
MDN:    https://developer.mozilla.org/zh-CN/
css属性书写顺序
1、布局定位属性：display / position / float / clear / visibility / overflow（建议 display 第一个写，毕竟关系到模式）
2、自身属性：width / height / margin / padding / border / background
3、文本属性：color / font / text-decoration / text-align / vertical-align / white- space / break-word
4、其他属性（CSS3）：content / cursor / border-radius / box-shadow / text-shadow
相对定位：position:relative;
绝对定位：position:absolute;
固定定位：position:fixed

如何实现固定定位的盒子跟随版心移动
将固定定位的盒子left:50%; 然后设置margin-left的值=版心的一半+定位盒子的宽度+任意值；
display显示与隐藏（不占位的隐藏）-记住
隐藏：display:none;
显示：display:block; 将隐藏的元素显示出来


overflow:hideen; 溢出隐藏，将超出固定宽高范围内的内容隐藏起来，不是删除了；
overflow:scroll; 显示横向和竖向的滚动条显示（不用）；
overflow:auto;溢出滚动， 将超出固定宽高范围的内容以滚动条的形式显示（不用）；

那么技术交流也就到这里了，如果你想变成IT大佬就来黑马吧。

来黑马培训的这一个月可是学到了不少技术，虽然时间很短且是基础班，但是不得不说3个字，黑马牛逼。那么下面就讲一讲关于web前端，HTML及css的一些小知识吧。
web标准的组成部分
1、结构标准（HTML）
2、表现标准（CSS样式）
3、行为标准（javascript）
关于HTML的概念
1、HTML是超文本标记语言，不是编程语言；
2、用HTML标签来描述网页元素，比如：链接、图片、文字等；
3、我们需要将所有的标签放在尖括号“<>” 里面
图片的常见属性
src        属性值 --- url      图像路径
alt        属性值 --- 自定义文本    图像不能正常显示的时候替换文本；
title       属性值 --- 自定义文本    鼠标移入图片显示提示文本；
width     属性值 --- 自定义数值    设置图片的宽度；
height    属性值 --- 自定义数值    设置图片的高度；
列表
无序列表、有序列表、自定义列表（项目列表）


input文本控件
所有的input控件都是通过更改type的取值不同实现不同的效果；
文本框：input的type取值为text    <input type=“text” />
可以设置value属性设置默认的值，<input type=“text”  value=“默认值” />
密码框：input的type取值为password   <input type=“password” />
单选按钮：type=“radio” ,想要实现单选效果我们需要给input标签设置相同的name进行设置归为一类；                  <input type="radio" name="sex">
复选按钮：type=“checkbox”，也可以设置同样的name名称，但是 不会影响多选的效果；                             <input type="checkbox" >
注意：如果想要实现单选按钮和复选按钮默认选中效果我们就需要设置对应的属性checked=“checked”
单选按钮   <input type="radio" checked="checked“  >
文档查询
W3C :   http://www.w3school.com.cn/
MDN:    https://developer.mozilla.org/zh-CN/
css属性书写顺序
1、布局定位属性：display / position / float / clear / visibility / overflow（建议 display 第一个写，毕竟关系到模式）
2、自身属性：width / height / margin / padding / border / background
3、文本属性：color / font / text-decoration / text-align / vertical-align / white- space / break-word
4、其他属性（CSS3）：content / cursor / border-radius / box-shadow / text-shadow
相对定位：position:relative;
绝对定位：position:absolute;
固定定位：position:fixed

如何实现固定定位的盒子跟随版心移动
将固定定位的盒子left:50%; 然后设置margin-left的值=版心的一半+定位盒子的宽度+任意值；
display显示与隐藏（不占位的隐藏）-记住
隐藏：display:none;
显示：display:block; 将隐藏的元素显示出来


overflow:hideen; 溢出隐藏，将超出固定宽高范围内的内容隐藏起来，不是删除了；
overflow:scroll; 显示横向和竖向的滚动条显示（不用）；
overflow:auto;溢出滚动， 将超出固定宽高范围的内容以滚动条的形式显示（不用）；

那么技术交流也就到这里了，如果你想变成IT大佬就来黑马吧。