是HTML+CSS的学习笔记捏

目录

• HTML+CSS导学
• • 1. 拨云见日
  • • 1.1 基础知识
    • 1.2 VS Code
    • 1.4 Chrome浏览器
    • 1.5 深入了解 站开发
    • 1.6 web前端的三大核心技术
    • 1.7 HTML基础结构与属性
    • 1.8 HTML的初始代码
    • 1.9 HTML注释
    • 1.10 HTML语义化
    • 1.11 标题与段落
    • 1.12 文本修饰标签
    • 1.13 图片标签与图片属性
    • 1.14 引入文件的地址路径
    • 1.15 跳转链接
    • 1.16 跳转锚点
    • 1.17 特殊符
    • 1.18 无序列表
    • 1.19 有序列表
    • 1.20 定义列表
    • 1.21 嵌套列表
    • 1.22 表格标签
    • 1.23 表格属性
    • 1.24 表单标签
    • 1.26 表格表单组合
    • 1.27 与
    • 1.28 CSS基础语法
    • 1.29 内联样式与内部样式
    • 1.30 CSS样式的引入方式
    • 1.31 css中的颜色表示法
    • 1.32 css背景样式
    • 1.33 css背景实现视觉差效果
    • 1.34 css边框样式
    • 1.35 边框实现三角形
    • 1.36 css文字样式
    • 1.37-42 CSS段落样式
    • 1.43 CSS复合样式
    • 1.44-45 CSS选择器
  • 2. 溯本求源
  • 3. 风生水起
  • 4. 巧夺天工

HTML+CSS导学

1. 拨云见日

①基础的HTML和CSS的学习
②熟悉切图流程、切图方式
③实战阶段了解PC企业站布局和PC游戏站布局

1.1 基础知识

• 1.“HTML、CSS”——是做 站的编程语言。
• 2.浏览器解析代码→呈现 站
  右键 页选择查看 页源代码
• 3. 站由 页组成
  页 .html文件
  

1.2 VS Code

• 支持几乎所有主流的开发语言的语法高亮、语法检查、智能代码补全、自定义热键、括 匹配、代码片段、代码对比 Diff、GIT 等特性，支持插件扩展，并针对 页开发和云端应用开发做了优化。软件跨平台支持 Win、Mac 以及 Linux。

设置 ：文件→首选项→设置（大小、是否换行 word wrap）

创建文件、创建文件夹、重命名和删除、搜索

• Ctrl + s ：保存
  Ctrl + a ：全选
  Ctrl + x ：剪切
  Ctrl + c ：复制
  Ctrl + v ：粘贴
  Ctrl + z ：撤销
  Ctrl + y ：前进
  shift + end ：从头部选中一行
  shift + home ：从尾部选中一行
  shift + alt + ↓ ：快速复制一行
  alt + ↑或↓ ：快速移动一行
  tab ：向后缩进
  tab + shift ：向前缩进
  alt + 鼠标左键 ：多光标
  Ctrl + d ：选择相同元素的下一个

简单使用VScode

1.4 Chrome浏览器

下载地址 ：https://www.google.cn/chrome/

五大浏览器 ：IE、火狐（Firegox）、谷歌（Chrome）、Safari、Opera

1.5 深入了解 站开发

一个大型 站的开发需要团队配合，各个岗位都不可或缺

• UI设计师

  • 设计稿（图片、文字、风格、按键等）
  • 指从事对软件的人机交互、操作逻辑、界面美观的整体设计工作的人

• web前端开发工程师（H5开发）

  • 主要进行 站的开发、优化、完善的工作
  • 将设计稿转化成代码
  • 将数据库里的数据显示到页面
  • HTML（结构）+CSS（样式）的编写

• web后端开发工程师

  • 负责小程序前端修改和优化升级，根据 站业务需要开发和程序修改。
  • 负责 站日常运行的技术维护工作，对出现的问题积极有效的进行处理；
  • 用html5，css3及JavaScript,vue或uniapp完成页面制作，对完成的页面进行维护和对 站前端性能做相应优化；
  • 丰富互联 的Web开发，改善用户体验；
  • 进行相关数据处理、查询，统计和分析工作。

1.6 web前端的三大核心技术

• HTML ：结构
• CSS ：样式
• JavaScript ：行为（与用户的交互、图片等）

添加一点点点新东西

1.7 HTML基础结构与属性

• 超文本标记语言（HyperText Maekup Language），标准通用标记语言下的一个应用。是 页制作必备的编程语言

• HTML：超文本 标记 语言

• 超文本：文本内容、非文本内容（图片、视频、音频等）

• 标记（标签）：

• 语言：编程语言
  
  

• 写法分成两种

  • 单标签：
  • 双标签：

• 创建标签的快捷键：单词 + tab键→
  标签可以上下排列，也可以组合嵌套。
  标签的属性：来修饰标签的，设置当前标签的一些功能。
  

• 每个.html文件都有的代码叫做初始代码，要符合html文件的规范写法
• ！+ tab键：就可以快速创建初始代码