CSS背景样式和列表样式
摘要：background-color 设置元素的背景颜色 background-image 把图像设置为背景 background-position 设置背景图像的起始位置 background-attachment 背景图像是否固定或者随着页面的其余部分滚动 background-repeat 设置背
阅读全文
posted @ 2018-08-16 14:57
08 2018 档案
盒子模型案例应用
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>盒子模型案例应用</title> <style type="text/css"> *{margin: 0;padding: 0;font-family: "微软雅黑
阅读全文
posted @ 2018-08-16 14:46
display属性
摘要：display属性： inline 元素将显示为内联元素，元素前后没有换行符。 block 元素将显示为块级元素，元素前后会带有换行符。 例子： div{display:inline;} span{display:block;} inline-block 行内块元素，元素呈现为inline，具有bl
阅读全文
posted @ 2018-08-10 22:58
margin外边距属性
摘要：外边距属性： 设置元素与元素之间的距离（外边距），4个方向（上右下左）。 margin：长度值|百分比|auto margin-top margin-right margin-bottom margin-left 说明：值可为负值。 默认情况下，相应HTML块级元素存在外边距 body、h1~h6、
阅读全文
posted @ 2018-08-10 22:39
padding填充属性
摘要：内边距属性： 设置元素的内容与边框之间的距离。 分4个方向（上右下左）： padding-top padding-right padding-bottom padding-left 说明：值不能为负值。 盒子在网页中占的空间，不单单与width和height属性有关， 还与padding有关。
阅读全文
posted @ 2018-08-10 22:24
border边框属性
摘要：边框属性： 边框宽度（border-width）：thin、medium、thick、长度值 边框颜色（border-color）：颜色、transparent（透明） 边框样式（border-style）： none 定义无边框，默认值 hidden 与none相同，除非在表格元素中解决边框冲突时
阅读全文
posted @ 2018-08-10 15:23
height属性
摘要：高度属性： height:长度值|百分比|auto 最大高度：max-height 最小高度：min-height 说明：设置块级元素和替换元素的内容高度。
阅读全文
posted @ 2018-08-10 13:41
width属性
摘要：宽度属性 width:长度值|百分比|auto 最大宽度：max-width 最小宽度：min-width 说明：设置块级元素和替换元素的内容宽度。
阅读全文
posted @ 2018-08-10 13:36
盒子模型的概念
摘要：盒子模型用来“放”网页中的各种元素。 网页设计中内容，如文字、图片等元素，都可是盒子（DIV嵌套）。
阅读全文
posted @ 2018-08-10 13:28
文本样式其他属性
摘要：文本样式属性 word-spacing 设置元素内单词之间间距。 letter-spacing 设置元素内字母之间间距，汉字是字与字之间的间距。 text-transform 设置元素内文本的大小写（capitalize、uppercase、lowercase、none）。 首字母大写 全大写 全小
阅读全文
posted @ 2018-08-09 17:32
vertical-align
摘要：vertical-align属性 设置元素内容的垂直方式。 属性值：baseline、sub、super、top、text-top、middle、bottom、text-bottom、长度、百分比 注：对行内元素和单元格元素有效。 例子： vertical-align: 15px; 向上移15px
阅读全文
posted @ 2018-08-09 17:12
文本对齐方式（text-align）
摘要：text-align 设置元素内文本的水平对齐方式。 属性值：left、right、center、justify 注：该属性对块级元素设置有效。
阅读全文
posted @ 2018-08-09 16:51
文字样式属性
摘要：文字样式属性 字体：font-family 文字大小：font-size 文字颜色：color 文字粗细：font-weight（normal、bold、bolder、lighter、100~900） 文字样式：font-style（normal、italic、oblique） font-varia
阅读全文
posted @ 2018-08-09 16:38
CSS权值
摘要：选择器权值 标签选择器：权值为1 类选择器和伪类：权值为10 ID选择器：权值为100 通配符选择器：权值为0 行内样式：权值为1000 !important规则： 可调整样式规则的优先级 添加在样式规则之后，中间用空格隔开 div{color:red !important;}
阅读全文
posted @ 2018-08-09 13:24
伪类选择器
摘要：链接伪类 链接的4种状态：激活状态、已访问状态、未访问状态和鼠标悬停状态。 :link 未访问的链接 :visited 已访问的链接 :hover 鼠标悬停状态 :active 激活的链接（点下鼠标松开鼠标之前的状态） 例子： a:link{color:red;} 链接伪类的顺序： :link >
阅读全文
posted @ 2018-08-09 11:46
css后代选择器
摘要：后代选择器： <p><em>CSS</em>层叠样式</p> 使用后代选择器设置，之间用空格隔开： p em{font-size:40px;} 例子： p a em{......} #p1 em{......} p.red a em{......}
阅读全文
posted @ 2018-08-09 11:26
群组选择器和全局选择器
摘要：群组选择器 集体统一设置样式： p,h1,h2,h3,h4{font-size:30px;} 注意：class和id的值区分大小写。 全局选择器 所有标签设置样式： *{ color:blue; ...... }
阅读全文
posted @ 2018-08-09 11:16
选择器（ID选择器）
摘要：ID选择器： 为HTML标签添加ID属性： <p id="p1">内容1</p> <p id="p2">内容2</p> 通过ID选择器来为具有此ID的元素设置CSS规则： #p1{color:red;} #p2{color:blue;}
阅读全文
posted @ 2018-08-09 11:08
选择器（标签选择器和类选择器）
摘要：标签选择器： 以HTML标签作为选择器： 例： p{color:blue;} p,h1,h2,h3,h4{font-size:30px;} 类选择器： 为HTML标签添加class属性： 例： <h1 class="red">内容1</h1> <p class="red">内容2</p> 通过类选择
阅读全文
posted @ 2018-08-09 11:03
CSS使用方法
摘要：CSS行内样式： 在开始标签内添加style样式属性 如：<p style="color:red;">内容</p> CSS内部样式： 内部样式（嵌入样式），把css样式代码写在： <style type="text/css"> 样式... </style> 说明：<style>要放在<head>标签
阅读全文
posted @ 2018-08-09 10:33
css基础语法
摘要：CSS样式规则 CSS规则由两部分构成：选择器，声明 例如： h1{color:red; font-size:14px;} CSS引用： 写在<head></head>标签内： <style type="text/css"> CSS样式... </style> CSS注释： html注释：<!--注
阅读全文
posted @ 2018-08-09 10:11
div和span与块级和行内标签
摘要：<div>标签： 是一个区块容器标记，<div></div>之间是一个容器， 可以包含段落、表格、图片等各种HTML元素。 <span>标签： 没有实际意义，为了应用样式。 img标签引入图片时，路径中使用斜杠/ 和 反斜杠\ 是一样的。 HTML标签： 块级标签：占据一行，换行。 行内标签：在一行
阅读全文
posted @ 2018-08-08 22:43
表单属性
摘要：<form>标签： <form action=" " method=" " name=" " ...> 表单元素 </form> 属性 值 描述 action URL 提交表单时向何处发送表单数据 method get、post 设置表单以何种方式发送到指定页面 name form_name 表单的
阅读全文
posted @ 2018-08-08 22:26
textarea（多行文本域）
摘要：多行文本域<textarea>： <textarea name="..." rows="..." cols="..." ...> 内容...... </textarea> 属性： name 设置文本区的名称 placeholder 设置描述文本区域预期值的简短提示 rows 设置文本区内的可见行数
阅读全文
posted @ 2018-08-08 22:04
select标签（分组下拉菜单和列表）
摘要：分组下拉菜单和列表标签： <select name=" " > <optgroup label="组1"> <option value="..." >选项</option> <option value="..." >选项</option> ...... </optgroup> <optgroup l
阅读全文
posted @ 2018-08-08 17:35
select标签（下拉菜单和列表）
摘要：下拉菜单和列表标签： <select> <option value="..." >选项</option> <option value="..." >选项</option> ...... </select> <select>标签属性： name 设置下拉菜单和列表的名称 multiple 设置可选择多
阅读全文
posted @ 2018-08-08 17:28
input标签（图像域和隐藏域）
摘要：图像域（图像提交按钮）： <input type="image" name="..." src="imageurl" /> 隐藏域： <input type="hidden" name="..." value="..." />
阅读全文
posted @ 2018-08-08 17:12
input标签（按钮）
摘要：按钮： <input type="button" name="..." value="..." /> <input type="submit" name="..." value="..." /> <input type="reset" name="..." value="..." />
阅读全文
posted @ 2018-08-08 17:00
input标签（单选框和复选框）
摘要：单选框： <form> <input type="radio" name="..." value="..." checked /> </form> 注意：同一组的name值要相同。 复选框： <form> <input type="checkbox" name="..." value="..." c
阅读全文
posted @ 2018-08-08 16:49
input标签（文本域和文件域）
摘要：单行文本域： <form> <input type="text" name="..." ....../> </form> 属性： name 文字域的名称；用于表单元素命名。数据处理时，通过name名称来区分。 maxlength 指用户输入的最大字符长度 size 指定文本框的宽度，以字符个数为单位
阅读全文
posted @ 2018-08-08 16:36
表单
摘要：表单： <form> 表单元素（包括文本域、单选框、复选框、按钮、列表......） </form> 注意：表单本身不可见。 HTML表单 Form标签中，以下标签实现表单元素添加： <input> 表单输入标签 <select> 菜单和列表标签 <option> 菜单和列表项目标签 <textar
阅读全文
posted @ 2018-08-08 13:27
表格嵌套
摘要：表格嵌套： <table> <tr> <td>...</td> <td> <table> <tr> <td>...</td> <td>...</td> </tr> </table> </td> </tr> ...... </table> 嵌入表格说明： 1、完整表格结构。 2、放到<td>标签中。
阅读全文
posted @ 2018-08-08 10:39
表格属性二
摘要：<tr>标签属性： align 行内容的水平对齐（left、center、right、justify、char） valign 行内容的垂直对齐（top、middle、bottom、baseline） bgcolor 行的背景颜色 <td>和<th>标签属性： align 单元格内容的水平对齐（le
阅读全文
posted @ 2018-08-08 10:19
表格属性一
摘要：<table>表格属性： width 规定表格的宽度 align 表格相对周围元素的对齐方式（left、center、right） border 规定表格边框的宽度 bgcolor 表格的背景颜色 cellpadding 单元边沿与其内容之间的空白 cellspacing 单元格之间的空白 fram
阅读全文
posted @ 2018-08-08 10:04
带标题、表头和结构的表格
摘要：带结构的表格： <table> <caption>...</caption> 表格标题，居中显示 <thead> <tr> <th>表头</th> 表格头，内容居中、加粗显示 ... </tr> </thead> <tbody> <tr> <td>主体</td> ... </tr> </tbody>
阅读全文
posted @ 2018-08-08 09:47
基础表格
摘要：HTML表格： <table> 表格 <tr> 行 <td> 单元格 基本语法与结构： <table> <tr> <td>......</td> ...... </tr> <tr> <td>......</td> ...... </tr> </table>
阅读全文
posted @ 2018-08-08 09:21
链接扩展功能
摘要：电子邮件链接：<a href="mailto:邮件地址">......</a> 文件下载：<a href="下载文件的地址">......</a> 1、下载文件要压缩。 2、直接写下载的文件名，会打开文件。
阅读全文
posted @ 2018-08-08 09:07
锚链接（不同页面）
摘要：定义锚（不同页面）： 网页1：<a href="网页2的名称#锚名">......</a> 网页2：<a name="锚名">......</a>
阅读全文
posted @ 2018-08-08 09:02
锚链接（同一页面）
摘要：定义锚： <a href="#锚名1">目录1</a> <a href="#锚名2">目录2</a> <a href="..." name="锚名1">内容</a> ************************** ******************************** <a href
阅读全文
posted @ 2018-08-08 08:32
超链接（空链接-target-title属性）
摘要：空链接：<a href="#">内容</a> 超链接标签： <a href=" " >内容</a> 属性： href 链接地址 target 链接的目标窗口 _self、_blank、_top、_parent title 链接提示文字 name 链接命名
阅读全文
posted @ 2018-08-08 08:19
超链接（基础）
摘要：超链接标签： 语法： <a href=" " >内容</a> href：链接地址，可以是内部链接或外部链接。
阅读全文
posted @ 2018-08-08 08:11
图像
摘要：图像标签 语法： <img src=" " alt=" " .../> img属性： 属性 值 描述 src(必写) URL 显示图像的URL alt 文字 图像替代文本 height 数值和百分比 图像的高 width 数值和百分比 图像的宽 注意： 当由于：网速太慢、src属性中的错误、浏览器禁
阅读全文
posted @ 2018-08-07 19:57
列表标签-定义列表
摘要：定义列表： <dl> <dt>定义列表项</dt> <dd>列表项描述</dd> <dd>列表项描述</dd> <dt>定义列表项</dt> <dd>列表项描述</dd> ...... </dl> 定义标签内可以有多个<dt> 对于每一个<dt>可以有多个<dd> <dt>和<dd>是同级标签 注意
阅读全文
posted @ 2018-08-07 19:25
列表标签-有序列表
摘要：有序列表： <ol> <li>列表项</li> <li>列表项</li> ...... </ol> type属性值： 1 数字1,2...... a 小写字母a,b...... A 大写字母A,B...... i 小写罗马数字i I 大写罗马数字I
阅读全文
posted @ 2018-08-07 19:19
列表标签-无序列表
摘要：无序列表： <ul> <li>列表项</li> <li>列表项</li> ...... </ul> type属性值： disc 圆点 square 正方形 circle 空心圆
阅读全文
posted @ 2018-08-07 19:12
修饰标签和特殊符号
摘要：水平线标签：<hr> 文字斜体：<i></i>、<em></em> 加粗：<b></b>、<strong></strong> 下标：<sub></sub> 上标：<sup></sup> 特殊符号： < 小于号或显示标记 > 大于号或显示标记 ® 已注册 © 版权 &tr
阅读全文
posted @ 2018-08-07 19:02
文字和段落标签
摘要：标题标签：<h1></h1>~<h6></h6> 段落标签：<p></p> align对齐属性值： left左对齐内容 right右对齐内容 center居中对齐内容 justify对行进行伸展，这样每行都可以有相等的长度 换行标签：<br/> 空格的代码： 预格式化标签：<pre></
阅读全文
posted @ 2018-08-07 18:51
浙公网安备 33010602011771号