黑马程序员技术交流社区

标题: 前端基础学习记录 [打印本页]

---

作者: 蔡旗    时间: 2019-6-7 15:09
标题: 前端基础学习记录
前端html部分
学习了一些标签
标题标签 h1-h6
段落标签 p
水平线标签 hr
换行标签 br
常用的布局标签  div 和 span
文本格式化标签 b i s u  strong em del ins
图像标签 img
html基本上就是学习了这些标签的运用，一些我们后期布局常用的无序列表ul嵌套li ，还有input控件也是我们页面布局常用的元素。
css部分
css是控制我们网页的表现形式，首先我们学习css的书写样式，有三种行内式、内嵌式和外链式，其中外链式是以后书写最多的样式
后面学习了css的选择器  选择好选择器很关键，这决定了我们选出的内容的表现形式，一般都是类选择器和后代选择器结合使用。
在后来学习了很多css的属性和属性值，比如控制一个属性和属性值我们就能实现改变字体的大小、颜色、粗细等示例如下：
font-size：22px；这个表示给自己改变大小为22像素
在后来学习了模式，他是块元素还是行内元素，还是行内块元素，
学习了他们的特性
块元素独占一行，宽高外边距内边距都能控制；
行内元素一行可以显示多个，高宽直接设置是无效的；
行内块元素比较特别可一行显示多个，但是中间会有空隙。默认宽度是他内容的宽度
通过display转换三种模式
CSS 背景(background)
背景颜色(color)背景图片(image)背景平铺（repeat）背景位置(position) 重点背景透明background: rgba(0, 0, 0, 0.3);盒子边框（border）
边框是由border-width 边框粗细
border-style边框样式
border-color边框颜色三部分组成的
内边距（padding） 外边距（margin）

内边距和外边距差不多都是根据四个方向改变四个方向的值来调整盒子的位置
四个方向上top下bottom 左left右right

网页布局的本质
1，首先利用css设置盒子的大小，然后摆放盒子的位置。
2，把网页元素比如文字图片等等，放入盒子里面。
我个人觉得先设置好盒子，设好实体化三步宽高背景颜色先把他显示出来，然后根据你的内边距或外边距，浮动或定位去调整盒子的位置，等你的大盒子位置先布置好了再去调整里面的内容就相对简单了。
虽然看似这几天没有学习多少东西，但是想要把这些东西全部融会贯通还是很难的，因为每个盒子的布局都需要你不停的去调用前面学习的知识，把他串联起来，
最后总结还是需要多敲代码，键盘敲烂月薪过万。

---

欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2