毕业以后参加过部分市场类的工作,一直挺迷茫.随着年龄的增长觉得自己的成长追不上时间的速度,经过跟朋友的沟通和自己的选择,打算学一手技术傍身,推荐了前端,大学专业是电子信息工程,也算是跨行吧.硬着头皮学吧,不知天高地厚．
学习的第一周，被老师＂安排＂着写一篇技术知识类的文章，我将在此梳理我第一周所学的知识点．有错误，望指正．
＜ｈｒ＞
从网页组成部分来说吧．
网页分成三个部分：ＨＴＭＬ结构＼ＣＳＳ表现＼ＪＳ行为．
第一周主要讲了ｈｔｍｌ５和ＣＳＳ部分核心属性
什么是ｈｔｍｌ５hyper text makrup language 5 中文直译：超文本标记语言 ）
两个概念：
１、H5是HTML的第5个版本
2、H5是一门技术的总成
html5是HTML的第五次重大修改，是由w3c（万维网联盟）与WHATWG(网页超文本应用技术工作小组)合作的结果。H5网络标准统一，可以跨平台，多设备使用，语义化比较强，大大方便了程序猿。
学完第一周以后我在想以后会不会有一个软件像Word一样可以更方便的书写HTML和CSS然这是一个不知天高地厚人的幻想。
开始当然是先学如何“造房子”，也就是一个网页的架构。
学习了几个常用的标签
| 标题 |
<h1></h1><h2></h2><h3></h3>还有三个不常用的<h4>、<h5>、<h6> |
就是标题 写在><之间就行了 |
|
| 段落 | <p>段落文本内容</p> | 把字打在><之间就行了 | |
| 加粗 | <b>加粗的内容</b> | <strong>加粗的内容</strong>，有强调作用 | |
| 倾斜 | <i>倾斜的内容</i> | <em>倾斜的内容</em>，有强调作用 | |
| 删除线 |
<del></del> <s></s> 字中间一条线 |
下划线 | <u></u>,字下面一条线 |
| 上标 | <sup></sup>常用于数学,角标 | 下标 | <sub></sub>常用化学 |
| 强制换行 | <br> | 水平线 | <hr>,就是一条划分线 |
这些没有什么好说的，就是记住就行了。就好像工具：我需要剪刀了就把剪刀拿出来，需要锤子就拿锤子。
有些细节是需要注意的，像<p>段落内容</p>这种有两组<>是叫双标签,后面的</>可不能落下
<hr>这种显而易见属于单标签,
有两个后续常用的,并且大部分配合CSS使用的标签
| div | <biv>在页面中划分区域</biv> |
圈地似的,后续通过CSS可以 控制他的大小,背景颜色等等 |
| span | <sapn>在文本中选取部分文字</sapn> |
被选中的文字通过CSS可以设置 字体大小,颜色,粗细等等. |
还有两个通过链接来表现的标签.
一、图片<img src” 图片路径” title=”鼠标悬停图片后的提示信息” alt=”图片加载不出来后的提示信息”>
这是个单标签.
重点需要注意的是在路径上
当图片路径是在本地电脑真正存在的路径,当你在自己电脑上打开网页时没啥问题图片正常加载,但是当页面写好上传服务器后,在别的电脑就加载不出来了.
这叫绝对路径
我的理解就是,把图片跟网页文件一定要绑在一块.不管网页到哪图片跟到哪.
也就是相对路径
- 第一种情况如果图片跟HTML文件在同一文件夹里,直接书写图片名字<img src=”pic4.gif”>
- 第二种情况如果图片的文件夹跟HTML文件在同一文件夹里,先书写文件夹的名字,加/,在书写图片名字比如我的文件夹名字叫”图片”,即<img src=”图片/pic4.gif”>
- 第一种情况如果图片的文件夹跟html文件夹在同一目录下,那就需要先跳出文件夹然后再写第二中情况,即<img src=”../图片/pic4.gif”>,”../”可以理解成返回上一个文件夹,同理还可以继续跳../../
二、超链接<a href=”路径” title=”鼠标悬停图片后的提示信息” target=”在哪打开链接”>内容</a>
相对于图片,超链接更好理解一些.通常就是用于点击打开网页
需要注意的是路径,不能直接些www.baidu.com 前面一定要有HTTP://
target默认是在本页面直接跳转,而blank则是打开一个新的页面用来跳转.
这是个双标签
然后就到了列表的学习
列表分三种 有序列表 无序列表 自定义列表
先说一下有序列表
表现出来是这样的
也可以随便从哪一个序号开始
表现是这样的
加一个 start的属性即可属性值写3
属性可以是大写A 小写a 大写罗马I 小写i
接下来是无序列表
表现出来是这样
默认是实心圆的图案,如果在标签里加上属性Type可以改变 基础属性有三个,circle空心圆/disc实心圆/square方形”
大肠包小肠,如果无序列表里面在包含一个无序列表,他将自动图案
例如:
最后一个是自定义列表
多用于提问和图片文字相关联
第二行根据第一行位置有缩进.
又继续学习了以后制作登录框架的表格
框架就是<form>
<input >
<input >
<form>
action可以理解为传输过程,默认是get 常用post.
因为post在传输的数据量传输安全性方面都优于get.
input里面的属性有 type placeholder namevalue
pklaceholder和name我想一块说一下
前者是给用户看,从页面上可以看到
后者是跟后端的”暗号”
value 直译就是”值”的意思,可以用来记住账号密码,可设置想要的数值 文字等
html最后就是学了些特殊字符
然后我们就开始学习部分CSS了,这个更有趣了些
什么是CSS(casading style sheet 中文直译:层叠样式表)/h2>
WEB标准中的表现标准语言,表现标准语言在网页中主要对网页信息的显示进行控制
简单来说就是修饰网页信息的显示样式
HTML来”搭房子”CSS来”装修”
CSS的语法
选择器(选择符){
属性：属性值；
属性：属性值；
}
属性必须放在花括号中 属性用冒号连接属性值 属性每组属性之间用分号隔开
选择器有哪些/span>
首先选择器分为五大类：
基本选择器，层次选择器，伪类选择器、属性选择器、伪对象选择器。
我现在只学了
基本选择器
层次选择器
就先总结这两个吧
1、基本选择器
- 类型选择器 ——指直接用Html中的标签做为选择符,常用来统一该标签元素显示的样式.
- Class选择器——想要区分某个标签时用,比如想要区分两个
来源：不知天高地厚的年轻人
声明：本站部分文章及图片转载于互联网，内容版权归原作者所有，如本站任何资料有侵权请您尽早请联系jinwei@zod.com.cn进行处理,非常感谢！