htmlcss简介
1. ⽹页组成部分
* 结构html:Hyper Text Markup Language，超⽂本标记语⾔，HTML是⽹页内容的载体，内容就是⽹页制作者放在页⾯上想要让⽤户浏览的信息，可以包含⽂字、图⽚、视频等。
* 表现css：Cascading Style Sheets，层叠样式表，CSS样式是表现。就像⽹页的外⾐。⽐如，标题字体、颜⾊变化，或为标题加⼊背景图⽚、边框等。所有这些⽤来改变内容外观的东西称之为表现。
* ⾏为javaScript(jQuery)：JavaScript是⽤来实现⽹页上的特效效果。如：⿏标滑过弹出下拉菜单。或⿏标滑过表格的背景颜⾊改变。还有购物⽹站中图⽚的轮换。可以这么理解，有动画的，有交互的⼀般都是⽤JavaScript来实现的
* ⼀个良好的⽹页，需要结构表现⾏为，解耦。
2.HTML简介：
* HTML是⽤来描述⽹页的⼀种语⾔。
* HTML指的是超⽂本标记语⾔ (Hyper Text Markup Language)
* 超⽂本就是指页⾯内可以包含图⽚、链接，甚⾄⾳乐、程序等⾮⽂字元素
* HTML不是⼀种编程语⾔，⽽是⼀种标记语⾔ (markup language)
* 标记语⾔是⼀套标记标签 (markup tag)
* HTML使⽤标记标签来描述⽹页
3. HTML语法
* HTML有两种标签，⼀种叫有开始有结束的标签，另外⼀种叫⾃结束标签
* HTML标签不区分⼤⼩写
* HTML标签可以嵌套，但不能交叉嵌套
* HTML标签必须正确关闭
* HTML属性必须有值，且必须加双引号
* HTML注释不能嵌套
3.1. 常⽤标签
* 标题标签
* 语法：h1-h6
* div标签
* 语法：div
* 作⽤：⽆实际意义，布局
* 段落标签
* 语法：p
* 转义字符
* 语法：以&开头，以；结束
* 常⽤
* 空格： ；普通空格 &emsp；中⽂空格
* ⼤于号：>
html ul标签 * ⼩于号：<
* 版权符：©
* 列表
* 有序
<ol>
<li></li>
</ol>
* ⽆序
<ul>
<li></li>
</ul>
3.2. 重点标签
* 插⼊图⽚
* 语法：<img src="路径" alt="路径有误时的提⽰⽂本" title="⿏标悬停时的提⽰⽂本">
* 路径问题
* ⽬标⽂件与当前⽂件在同包，直接查⽬标⽂件
* ⽬标⽂件与当前⽂件不在同包，先⽬标⽂件的⽗包，再⽬标⽂件。
* 返回上⼀级： ../
* 超链接
* 语法：<a href="链接路径" target="链接以何种⽅式打开（_self|_blank）">⽂本</a>
* eg:<a href=""><img src=""></a>
* 表格
* 语法
<table>
<tr>
<th></th>|<td></td>
</tr>
</table>
* 跨⾏跨列
* 跨⾏：rowspan
* 跨列：colspan
* 表单
* 语法
<form action="表单提交路径" method="提交⽅式（get|post）"> <input>
<select>
<option></option>
</select>
</form>
* input标签中的属性：
type表单项的类型:text|password|radio|checkbox|reset|submit file⽂件域
hidden隐藏域
name名称：⽆name，就⽆法提交该数据
value值：text|password默认值，sumbit按钮的⽂本值
checked: radio&checkbox：默认选中
id：唯⼀
4. CSS
* 简介：Cascading Style Sheets层叠样式表
* 作⽤：美化html
* 语法：选择器{声明；声明2}
eg: p{color:red} #id{color:#ff0000}
* 选择器
* 标签选择器
* 类选择器
* id选择器
* 优先级：id>类>标签
* css嵌⼊⽅式
* ⾏内：style属性中
* 内部：style标签中
* 外部：xxx.css⽂件中（建议使⽤）
* css颜⾊值
* red
* ⼗六进制：#ff0000，取值范围0-ff
* rgb():rgb(255,0,0)，取值范围0-255
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。
发表评论