![](https://img-blog.csdnimg.cn/20200210171729633.jpg?x-oss-process=image/resize,m_fixed,h_224,w_224)
前端
html+css+js
时光·漫步zth
辛酸泪,影单醉。
展开
-
HTML文件基本结构
HTML 文件基本结构<!DOCTYPE html> //文档的说明<html> //标记文档的开始和结束<head> //文档的...原创 2018-04-22 10:55:34 · 2361 阅读 · 0 评论 -
HTML——表头标签<th>的属性
<th>标签的属性和<td>标签的属性及语法格式非常的相似,用于设定表格中某一表头的属性。<th>标签中常用的属性标签描述align设置单元格内容的水平对齐方式valign设置单元格内容的垂直对齐方式bgcolor设置单元格的背景颜色background设置单元格的背景图片width设置单元格的宽度height设置单元格的高度rowspan设置单元格的水...原创 2018-04-29 00:04:17 · 13628 阅读 · 0 评论 -
HTML——表格的结构标签
在HTML 中除了对表格的设计标签外,还有一些标签是用来明确表格结构的,这些标签在源码中清晰的区分表格结构,HTML中规定了<thead>、<tbody>和<tfoot> 三个标签,分别对应表格的表首、表主体和表尾。使用这些标签能对表格的一行或多行单元格的属性进行统一修改,从而省去了逐一修改单元格属性的麻烦。1. 设置表首样式 功能: 表...原创 2018-04-29 12:17:13 · 3415 阅读 · 0 评论 -
HTML——表单概述
表单通常设计在一个 HTML 文档中,当用户填写完信息后做提交操作,将表单的内容从客户端的浏览器传送到服务器上,经过服务器处理程序后,再将用户所需信息传送回客户端的浏览器上,这样网页就具有了交互性。HTML 是用户与网站实现交互的重要手段。 表单的主要功能是收集信息,具体说是收集浏览者的信息。最常见的表单形式主要包括文本框、单选按钮,复选框、按钮等 ...原创 2018-04-29 21:35:55 · 336 阅读 · 0 评论 -
HTML——表单标签
表单是网页上的一个特定区城。这个区城是由一对 <form> 标签定义的。在<form> 与</form>之间的一切都属于表单的内容。 每个表单标签开始于 <form> 标签,可以包含所有的表单控件,还有任何必需的伴随数据,如控件的标签、处理数据的脚本或程序的位置等。在表单的<form> 标签中,还可以设置表单的基本属性,包括...原创 2018-05-02 09:22:07 · 363 阅读 · 0 评论 -
CSS——文本相关属性
一. 文字 1. 字体设置 在 HTML 语言中,文字的字体是通过 <font face= " 字体名称 ">来设置,而在 CSS 中字体总通过 font-family 属性进行控制。代码如下: <style> p{ font-family: SimSun, Microsoft YaHei; } </s...原创 2018-05-25 00:08:45 · 1136 阅读 · 0 评论 -
HTML——设置滚动文字
1. 滚动文字标签——marquee 使用<marquee>标签可以将文字设置为动态滚动的效果。 语法格式: <marquee>滚动文字</marquee> 也可以在标签之间设置文字的字体、颜色等。2. 滚动方向属性——direction 语法格式: <marquee direction="滚动方向">滚动文...原创 2018-05-14 22:11:19 · 104218 阅读 · 13 评论 -
HTML——audio标签和video标签
<video>标签专门用来播放网络上的视频或电影,<audio>标签则专门用来播放网络上的音频数据。使用这两个标签,就不再需要使用其他的任何插件了,只要使用支持 HTML5 的浏览器就可以了。 语法: <audio src=""> 您的浏览器不支持audio标签! </audio> 通过这种方法,可以把指定的音...原创 2018-05-15 00:01:50 · 8325 阅读 · 1 评论 -
HTML——多媒体标签的基本属性及使用
一. 多媒体标签基本属性 常用的多媒体标签主要有两个,分别是<video>和<audio>标签。1. src 属性和 autoplay 属性 src 属性用于指定媒体数据的 URL 地址。 autoplay 属性用于指定媒体是否在页面加载后自动播放,使用方让如下: <video src="" autoplay="autopla...原创 2018-05-15 11:07:34 · 4909 阅读 · 0 评论 -
CSS——背景相关属性
1. background-color: color | transparent color : color 设置背景的颜色,它可以采用英文单词、 十大进制、RGB、 HSL、HSLA 和 RGBA。 transparent: 表示透明。 2. background-image: none | url (url) no...原创 2018-06-03 19:30:33 · 665 阅读 · 0 评论 -
CSS——列表相关属性
列表相关属性常用的列表属性(list)字体标签描述list-style简写属性。用于把所有用于列表的属性设置于一个声明中list-style-image将图像设置为列表项标志list-style-position设置列表中列表项标志的位置list-style-type设置列表项标志的类型text-decoration:none 取消默认列表字体下划线。...原创 2018-06-03 20:39:44 · 378 阅读 · 0 评论 -
CSS——框模型
1. 设置内边距值说明border-width指定边框的宽度border-style指定边框的样式border-color指定边框的颜色inherit指定应该从父元素继承border属性值border-style属性设置一个元素的四个边框的样式。此属性可以有一到四个值。实例:border-style:dotted solid double dashed;上边框是点状右边框是实线下边框是双线左边框...原创 2018-06-03 21:23:15 · 472 阅读 · 0 评论 -
CSS——定位相关属性
属性值值描述absolute生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。fixed生成固定定位的元素,相对于浏览器窗口进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行原创 2018-06-04 22:50:18 · 1154 阅读 · 0 评论 -
CSS——transform实现2D变换
1. transform 的基本属性值值 描述 none 定义不进行转换。 matrix(n,n,n,n,n,n) 定义 2D 转换,使用六个值的矩阵。 matrix3d(n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n) 定义 3D 转换,使用 16 个值的 4x4 矩阵。 translate(x,y) 定义 2D 转换...原创 2020-02-11 10:54:07 · 1331 阅读 · 0 评论 -
JavaScript——弹窗
JavaScript 三种消息框:警告框、确认框、提示框。1. 警告框警告框经常用于确保用户可以得到某些信息。当警告框出现后,用户需要点击确定按钮才能继续进行操作。语法:window.alert(" sometext ");window.alert() 方法可以不带上 window 对象,直接使用alert()方法。<!DOCTYPE html><...原创 2018-12-07 16:39:44 · 729 阅读 · 0 评论 -
JavaScript——全局函数
1. eval() eval() 函数计算 JavaScript 字符串,并把它作为脚本代码来执行。如果参数是一个表达式,eval() 函数将执行表达式。如果参数是Javascript语句,eval()将执行 Javascript 语句。<script> var result = eval("2*4+5+(4*5)"); document.write(r...原创 2018-12-06 20:46:47 · 504 阅读 · 0 评论 -
JavaScript——输出
JavaScript 显示数据JavaScript 可以通过不同的方式来输出数据:使用 window.alert() 弹出警告框。 使用 document.write() 方法将内容写到 HTML 文档中。 使用 innerHTML 写入到 HTML 元素。 使用 console.log() 写入到浏览器的控制台。1. 使用 window.alert()你可以弹出警告框来显示...原创 2018-12-07 16:08:16 · 299 阅读 · 0 评论 -
HTML——图像的超链接
1. 设置图像的超链接 对整个一幅图像文件设置超链接 语法: <a herf="链接地址" target="目标窗口打开方式"><img src="图像文件的地址"></a> 功能: 为图片添加超链接 在图像属性中可以添加图像的其他参数,如 heigth、border、hspace 等..原创 2018-05-13 20:54:53 · 12299 阅读 · 3 评论 -
HTML——使用 img 标签插入 avi 文件
1. avi 的源文件属性——dynsrc 通过<img>标签的dynsrc 属性指定 avi 源文件的路径,就可以实现 avi 视频文件的插入了。 属性: dynsrc 功能: 设置avi源文件地址 语法: <img dynsrc="avi源文件地址">2. 设定 ...原创 2018-05-13 19:18:22 · 5510 阅读 · 2 评论 -
HTML——文字标签
1. 显示普通文字在 HTML5 页面插入普通文字的方法: 在 <body>标签和</body>标记之间直接输入文字2. 显示特殊符号 3. 标题字标签标签: <h1>~<h6>功能: 显示标题文字,字号逐渐减小语法: ...原创 2018-04-22 10:57:50 · 33612 阅读 · 1 评论 -
HTML——段落标签
1. 段落标签<p>标签: <P></p>功能: 修饰段落、自动换行语法: <p>段落文字</p>【注】 在HTML5中,段落标签既可以成对使用,也可以单独使用,为规范代码,建议成对使用<p>标签。2. 取消文字换行标签标签: <...原创 2018-04-22 11:52:31 · 8661 阅读 · 0 评论 -
HTML——列表标签
列表分为两种类型,即无序列表和有序列表。前者用项目符号来标记列表项,而后者则使用编号来记录项目的顺序。列表的主要标签标签描述<ul>无序列表<ol>有序列表<dir>目录列表<dl>定义列表<menu>菜单列表<dt>、<dd>定义列表标签<li>列表项目的标签1. 建立有序列表有序列原创 2018-04-22 20:09:09 · 6086 阅读 · 0 评论 -
HTML——链接标签
文本链接(Hypertextlink )通常简称为超链接(Hyperlink ),或者简称为链接(Link)。 链接是HTML.的一个最强大和最有价值的功能。链接是指文档中的文字或者图像与另一个文档、文档的一部分或者一幅图像链接在一起1.建立文本链接文本超链接通过网页中的文件和其他的文件进行链接。标签: <a>语法: <a h...原创 2018-04-22 23:13:09 · 1290 阅读 · 0 评论 -
HTML——表单输入标签
1. 文本框——text text 属性用来设定在表单的文本框中,输入任何类型的文本、数字、或字母。输入的内容以单行显示。语法如下: <input type="text" name="控件名称" size="控件的长度" maxlength=" 最长字符数" value="文字域的默认取值"/>text 文本框的参数表参数类型含义name文本款的名称原创 2018-05-06 12:26:26 · 3051 阅读 · 0 评论 -
HTML——绘制表格
在 HTML 的语法中,在表格中一般通过3个标签来构建,分别为表格标签、行标签和单元格标签。其中表格标签为<table></table>,表格的其他各种属性都要写在表格的开始标签<table>和表格结束材签</table>之间才有效。1.设置表格标题 在表格中可以通过 <caption> 标签来设置持殊的一种单元格即标题单元格。...原创 2018-04-26 23:12:10 · 14522 阅读 · 0 评论 -
HTML——行标签<tr>的属性
<tr>标签的属性用于设定表格中每一行的属性,在设定了表格的整体属性后,还可以对单独的一行表格进行属性设置。1. 设置行的高度功能: 某一行高度和其他行高度不相等时,需要使用 height 属性语法: <tr height=value> value:设置行的高度(只对本行有效)2. 设置行的边框颜色功能: 通过设置 borderc...原创 2018-04-27 22:53:11 · 15519 阅读 · 2 评论 -
HTML——单元格标签<td>的属性
1. 设置单元格的大小在默认情况下,单元格的大小会根据单元格中的内容自动调整,也可以手动设置表格的宽度和高度。语法: <td width=value height=value> height: 设置单元格的高度。2. 设置单元格的水平对齐属性功能: 在水平方向上,设定单元格的对齐方式,分别有居左、居中、居右。语法: <td align=v...原创 2018-04-28 01:03:20 · 16283 阅读 · 0 评论 -
CSS——基础选择器
1. 元素选择器 最常见的CSS选择器是元素选择器。换句话说,文档的元素就是最基本的选择器。如果设置HTML样式,选择器通常是某个HTML元素,比如 b、h1、a,甚至可以是 HTML 本身。 html{color: black; } h1{ color: red;} a{color:yellow: }2. 类选择器 类选择器允许以一...原创 2018-05-19 00:35:57 · 146 阅读 · 0 评论 -
CSS——CSS样式表的创建
1. 样式表分类 内部样式表 外部样式表 行间样式表 2. 内部样式表 当单个文档需要特殊的样式时,使用内部样式表。使用 <style> 标签在文档头部定义内部样式表,语法格式如下: <style></style><head><style type="text/css">.p{ ...原创 2018-05-18 21:40:32 · 986 阅读 · 0 评论 -
HTML——文本域标签(textarea)
在 HTML 中还有一种特殊定义的文本样式,称为文本城。它与文本框的区别在于可以添加多行文字,从而可以输人更多的文本。这类控件在一些留言板中最为常见。 语法如下: <textarea name="文本域名称”value="文本域默认值" rows="行教”cols="列数"> </textarea>文本域标签属性文本域标签属性描述name文本域...原创 2018-05-06 19:27:57 · 44484 阅读 · 4 评论 -
HTML——列表/菜单标签
菜单列表类的控件主要用来进行选择给定答案中的一种,这类选择往往答案比较多,使用“单选”按钮比较浪费空间。可以说,菜单列表类的控件主要是为了节省页面空间可而设计的。菜单和列表都是通过<select>和<option>标签来实现的。 菜单是一种最节省空间的方式,正常状态下只能看到一个选项,单击按钮打开菜单后才能看到全部的法项。 列表可以显一定数最的选项。如果...原创 2018-05-06 20:05:13 · 7094 阅读 · 0 评论 -
CSS——复合类型选择器
1. 后代选择器(包含选择器) 后代选择器书写方法:把外层的标记写在前面,内层的标记写在后面,之间用空格分隔,当标记发生嵌套时,内层的标记就成为外层标记的后代了。 【注】可以在前面加上类或者ID选择器, 只要标签上有该class 或者id属性 ,选择器的嵌套尽量不超过三级 。【例】<html><head><title>后代选择器</titl...原创 2018-05-19 13:22:06 · 2295 阅读 · 0 评论 -
HTML——元素分类
一般 html 元素分为两种,即块级元素和行内元素。一 . 块级元素:block element 每个块级元素默认占一行高度,一行内添加一个块级元素后一般无法添加其他元素(float浮动后除外)。两个块级元素连续编辑时,会在页面自动换行显示。块级元素一般可嵌套块级元素或行内元素; 块级元素一般作为容器出现,用来组织结构,但并不全是如此。有些块级元素,如<form>...原创 2018-05-19 13:58:50 · 447 阅读 · 0 评论 -
HTML5新增表单属性
1. placeholder 属性 当用户还没有输入值的时候,输入型控件可以通过 placeholder 属性向用户显示描性说明或者提示信息。使用 placeholder属性只需要将说明性文字作为该属性值即可。除了普遍的文本输入框外,email、number、url 等其他类型的输人框也都支持placeholder 属性。 placeholder 属件的使用方法如下: ...原创 2018-05-13 11:00:22 · 6216 阅读 · 0 评论 -
HTML——添加图像、设置图像属性
一. 添加图像 标签: img 功能: 添加图像 语法: <img src="图像文件地址"> 【注】 路径可以是相对路径,也可以是绝对路径。二. 设置图像属性1. 图像高度——height 通过 height 属性可以设置图片显示的高度,默...原创 2018-05-13 17:21:56 · 15343 阅读 · 0 评论 -
bootstrap 文件上传域美化
效果: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <hea...原创 2019-05-19 16:56:05 · 1154 阅读 · 0 评论