本帖最后由 小石姐姐 于 2018-5-4 09:46 编辑
HTML&CSS 学习笔记
HTML
HTML概述: 结构标签 根标签:<html> 头标签:<head> 体标签:<body>
字体标签<font> colors属性中颜色顺序: 红绿蓝 RGB size属性取值范围是1-7 face字体
排版标签 段落<p> 横线<hr> 加粗<b> 或<strong> 倾斜<i> 下划线<u> 居中<center> 标题<h1> <h2> 换行<br /> 原生标签<pre>
图片标签<img> src :相对路径或绝对路径(网址) width :默认单位是px height:默认单位是px alt: 如果找不到图片显示的内容
列表标签 无序列表:<ul>
有序列表: <ol>
列表项:<li>内容<li> type属性 start属性
超链接标签<a> href: 相对路径或绝对路径(网址) target:打开的方式
_self: 在当前页面打开 _blank: 信件标签打开 _parent
表格标签<table> 属性;
border:边框,值表示边框宽度 width:表格宽度,可以写值,也可以写百分比 height:表格宽度,可以写值,也可以写百分比 aglin:水平位置 bgcolor:背景图片
行标签:<tr>
列标签: <td>
属性:
height weight colspan rowspan
表单标签<form> 作用:用于向服务器传输数据 常用属性:
action:提交路径,默认提交到当前页面 method:请求的方式,常用的有get和post,默认用get
Enctype:规定在发送表单数据之前如何对其进行编码
表单元素:
<input>
type="text"--文本框 常用属性: name:文本框的名称.name是必要的,不然后台无法获取该文本框的数据 value:文本框的默认值 size:文本框的长度 maxlength:文本框输入的最大长度 readonly:只读属性 disable:不可用的,数据不会提交到后台 type="password"--密码框 常用属性: name:密码框的名称.name是必要的,不然后台无法获取该文本框的数据 value:密码框的默认值 size:密码框的长度 maxlength:密码框输入的最大长度 type="radio"--单选按钮 常用属性: name:同一组的单选按钮的name属性需要相同 value checked type="checkbox"--复选框 常用属性: name:同一组的单选按钮的name属性需要相同 value checked type="button"--默认没有任何功能的按钮,需添加功能 type="submit"--提交按钮 type="reset"--重置按钮 type="file"--文件上传表单项 type="hidden"--隐藏字段 type="image"--图片按钮 HTML5扩展标签:
type="email" type="date" type="number" type="color"
<select>下拉列表
<textarea>文本域
框架标签 <frameset>
rows="20%,20%,*"行 cols="20%,20%,*"*列
<frame>
常用特殊字符
CSS
HTML的块标签 <div>:默认一个<div>独占一行 <span>:默认在同一行
引入方式 行内样式:直接在HTML的元素上使用style属性设置CSS 页面内样式:在HTML的<head>标签中使用<style>标签设置CSS 外部样式:定义一个CSS文件,用<link>引入文件 优先级关系:就近原则
选择器 元素选择器
ID选择器
类选择器
选择器分组 属性选择器 子元素选择器
后代选择器
并列选择器
CSS的浮动float CSS的样式背景 属性 | 描述 | background | 简写属性，作用是将背景属性设置在一个声明中。 | background-attachment | 背景图像是否固定或者随着页面的其余部分滚动。 | background-color | 设置元素的背景颜色。 | background-image | 把图像设置为背景。 | background-position | 设置背景图像的起始位置。 | background-repeat | 设置背景图像是否及如何重复。 |
文本属性 | 描述 | color | 设置文本颜色 | direction | 设置文本方向 | line-height | 设置行高 | letter-spacing | 设置字符间距 | text-align | 对齐元素中文本的首行 | text-decoration | 向文本中添加修饰 | text-indent | 缩进元素中文本的首行 | text-shadow | 设置文本阴影 | text-transform | 控制元素中的字母 | unicode-bidi | 设置文本方向 | white-space | 设置元素中空白的处理方式 | word-spacing | 设置字间距 |
字体属性 | 描述 | font | 简写属性.把所有针对字体的属性设置在一个声明中. | font-family | 设置字体系列 | font-size | 设置字体的尺寸 | font-size-adjust | 当首选字体不可用是,对替换字体进行智能缩放 | font-stretch | 对字体进行水平拉伸 | font-style | 设置字体风格 | font-variant | 以小型大写字体或正常字体显示文本 | font-weight | 设置字体的粗细 |
列表属性 | 描述 | list-style | 简写属性。用于把所有用于列表的属性设置于一个声明中。 | list-style-image | 将图象设置为列表项标志。 | list-style-position | 设置列表中列表项标志的位置。 | list-style-type | 设置列表项标志的类型。 | marker-offset |
|
CSS的盒子模型 CSS的定位 position
absolute:绝对位置 relative:相对位置 fixed:固定位置
left top
显示和隐藏 display
block:显示 none:隐藏 inline:同一行显示
|
|
收藏
淘帖
踩
