11.3html、css入门
最重要javascript
两天讲完html css 能认识就行 能用js控制
1.web前端技术是什么/web标准
web前端技术由w3c组织制定：
Html->结构标准：负责网页内容（文字，图片，音视频）
css->样式标准：美化
js->行为标准：行为动作，数据交互，表单验证
2.Html历史
超文本标记语言,与浏览器沟通的语言，学html学的就是标记，超文本是带符号的文本
学习目标：xhtml1.0 + html5.0
。。。
3.创建html
!+tab快速创建模版
调大字号
标记<></> --双标记
也有不成对出现的 --单标记
4.模版带码含义
<html></html>整个网页文档<head></head>网页的头，需要浏览器渲染的代码，包含css和js<body></body>网页主体：存储的是给用户看的内容<title></title>网页标题：浏览器的标题<!Doctype>规定文档的dtd格式：规定好浏览器一那个版本html协议解析代码<mate>与seo有关
5.常用标签
5.1注释 command+/
5.2标题标签
分六个几个级别 h1–h6
～～～ 一个页面只能使用一次h1标签，用来放网页的logo ### 5.3段落标签 ### 5.4 div前端做布局常用，划分区域，div里可放任何内容标签 ### 5.6 span存放特殊效果的文字，小图片6.常用不换行显示标签
<b></b>加粗
<i></i>倾斜
<u></u>下划线
<s></s>删除
<strong></strong>加粗 强调语气 有助于SEO
<em></em>倾斜 有强调语气
<ins></ins>下划线 同样强调语气
<del></del>删除 强调语气
<br> 换行标签
7. <img >图片标签
html有属性这个概念，键值对，k=‘v’，一个标签可以添加多个属性，多个属性之间用空格隔开
<img src='图片资源' alt='替换文本，图片无法显示就显示这里的文字,支持盲人读屏' title='提示文本'>
title也有助于seo，可以放上关键字
8. <a href=""></a>超链接标签
<a href="跳转地址,要加协议http://" target='_blank'></a>
超链接默认不换行
target="_blank"属性新标签页打开
假链接#不跳转
如果想要图片跳转，放入a标签里
9.布局初体验
先布局，划分区块；
布局的技巧：先分行，后分列
<div>
<div></div>
<img>
<p></p>
</div>
10.css的学习
cascading style sheet 层叠(覆盖)样式表
10.1书写位置：
1.嵌入式：写在head标签里.准备环境css写在里面
<head>
<style>
选择器{css的键值对k:v
cloro:颜色;
font-size:字体大小;
font-family:字体;
}
</style>
</head>
2.外链式：html和css单独文件存放代码。
//不用要style环境了,直接选择器，键值对
选择器{
键值对
}
//在html文件里，head标签里link入
<head>
<link rel='stylesheet(声明关系)' href='css路径'>
</head>
3.行内式：在标签身上添加一个style=“键值对”
行内式基本不用
一般电商网站首页用嵌入式写法，为了提高页面加载速度
10.2常用文字控制属性
加粗: font-weight: bold/normal;
倾斜：font-style:italic/normal;
下划线：font-decoration:underline/none; line-through(删除线)/overline(上划线)
字号：font-size：20px;
行间距：line-height;
首行锁进：text-indent：2em; (em是一个字的大小）
字体:font-family:
同样的还有布局常用属性
10.3选择器，就是要控制的的对象
- 标签选择器：以标签名字命名的选择器，但是都会选中
- 类选择器：需要定义和使用，定义需要以点开头，后面加名字：.aa;名字不区分大小写，规则和python一样；使用：在标签上添加class=“类选择器名”