基础
1、网页的组成
任何一个页面都有三部分
- 文本内容: 用户能看到的网页文本，例如新闻，电话等
- 其他资源的引用: 图片，视频，音频…
- 标记: 对文本，其他资源的描述
<p>我是php中文网的学生，薛少鹏</p><img src="logo.png" alt='log'>
2、html设计思想
- 超文本: 是指包括了超链接的文本
- 预定义标: 是用来描述内容的固定标签
- 语言: html 并不是编程语言, 只是用来书写html 文档的工具
3、 html 页面结构
<!-- 通知浏览器这是一个html文档 --><!DOCTYPE html><!-- 根标签，整个html文档内容必须写到这对标签中，lang="en" 表示通知搜索引擎html文档所使用的的编写语言。 --><html lang="en"><!-- head表示供浏览器和搜索引擎使用，描述字符集编码，视口语页面标题 --><head><!-- 字符编码集 --><meta charset="UTF-8" /><!--meta 设置页面元素数据。name="viewport" 设置视口（可视区屏幕）如何显示这个页面。width="device-width" 页面宽度应该与显示设备的宽度想匹配，类似还有device-height 表示设备的宽度--><meta name="viewport" content="width=device-width, initial-scale=1.0" /><!-- title 显示在浏览器标签上的文本，指定当前页面的标题 --><title>HTML5页面结构</title></head><!-- body 页面主体内容，允许或希望用户的内容都应该写到这里 --><body><!-- 页面主体内容 --><h2>PHP中文网欢迎您...</h2></body></html>
4、元素、属性、值
4.1、 元素与标签
| 元素 | 标签 | 描述 |
|---|---|---|
| 非空元素 | 双标签 | <p>学习使我快乐</p> |
| 空元素 | 单标签 | <img src=''> |
- 空元素也有使用双标签描述的，如:
<script>|<video>
4.2、 属性与值
- 属性写在起始标签中
- 值: 预定义值，字符串，指定格式，数值，bool
- 元素通用属性：id,class,style,这几个属性几乎可以添加到任何元素上。
5、层级关系
- 元素中包含另一个元素，被包含的叫子元素，子元素又可以集成包含其他元素，依次类推。
- 元素层级结构中，必须保持正确的嵌套关系。
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>元素的标签,属性和值,正确的嵌套关系</title></head><body><!-- 元素之间应该保持正确的嵌套 --><form action=""><div><label for="email">邮箱:</label><!-- 元素值: 预定义值, 指定值, 布尔值,数值 --><input type="email" name="email" id="email" maxlength="100" required /></div><div><label for="password">密码:</label><inputtype="password"name="password"id="papassword"placeholder="至少8位"required/></div><div><button>提交</button></div></form></body></html>
总结
跟了第十期学习了差不多一个月左右，学过之后，实践的很少，忘的也就差不多了。老师的这种理论实践相结合的教学方式。理论解决的面试问题，实践解决了工作问题。 希望能跟着老师一直走下去。