HTML & CSS 基础语法总结-程序员宅基地

技术标签： html5 Java后端总结与心得 html

HTML & CSS 初学者必知必会

本文档适合前端初学者学习HTML与CSS时参考

还可以看看博主其他的总结：

MySQL超详细使用总结：传送地址：MySQL超详细使用总结
JavaScript小白必看：传送地址：JavaScript小白必看

HTML

一、网页的组成部分

内容：网页中可以看到的数据，使用HTML技术实现
表现：内容在页面上的展示形式，如布局、颜色等，使用CSS技术实现
行为：页面中元素与输入设备交互的响应，使用javascript 技术实现

二、HTML简介

名称：Hyper Text Markup Language (超文本标记语言)
简介：HTML 通过标签来标记要显示的网页中的各个部分。网页文件本身是一种文本文件，通过在文本文件中添加标签，可以告诉浏览器如何显示其中的内容

三、创建HTML文件

在这里插入图片描述

选择浏览器执行

注意：java文件需要先编译，再由java虚拟机跑起来，而HTML文件无需编译，直接由浏览器进行解析执行

四、HTML文件的书写规范

HTML中注释的写法：
HTML文件最基本的要素：

<!DOCTYPE html> 
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    </head>
<body>

</body>
</html>

要素详解：
(1) <!DOCTYPE> 告诉浏览器当前HTML是用什么版本编写的，html标签表示HTML的开始
(2) 向搜索引擎表示该页面是html语言，并且语言为英文网站，其"lang"的意思就是“language”的意思，而“en”即表示english，如果需要的是中文页面，可将其改为
(3) 表示头部信息，一般包含三部分内容：title标签，css样式，js代码
(4) 表示当前页面使用UTF-8字符集
(5) Title 表示浏览器标签页的标题
(6) 表示头部信息结束
(7) 标签中的内容是整个html页面显示的主体内容
(8) 主体内容结束
(9) 表示整个HTML页面结束

五、HTML 标签介绍

标签的格式：<标签名>标签中的内容</标签名>
标签名不区分大小写
标签可以拥有自己的属性
(1) 基本属性：可以修改简单的样式效果
(2) 事件属性：可以设置事件响应后的代码
标签分为单标签和双标签

单标签中br/代表换行，hr/代表水平线
标签的语法(HTML代码有时标签不闭合也不报错)：
代码演示：基本的HTML要素的使用

<!DOCTYPE html>
<html lang="zh_CN">
<head>
    <meta charset="UTF-8">
    <title>我的第一个网页</title>
</head>
<body bgcolor="#deb887"> <!-- bgcolor是页面的背景颜色属性 -->
    hello!这是我的第一个网页！
    <hr/>
    有一个按钮
    <br/>
    <button onclick="alert('提示！')">按钮</button>
    <!-- onclick表示点击事件，alert()是javaScript语言提供的一个警告框函数，
         它可以接收任意参数，参数就是警告框内出现的信息 -->
</body>
</html>

运行结果：

点击按钮之后出现含有“提示”的警告框

六、常用标签介绍：

1.font字体标签:

可以用来修改文本的字体、颜色、大小等，常用的属性：
(1) color属性：修改字体颜色
(2) face属性：修改字体
(3) size属性：修改字体大小

代码示例：在网页上显示：我是字体标签，并修改字体为宋体，颜色为红色

<!DOCTYPE html>
<html lang="zh_CN">
<head>
    <meta charset="UTF-8">
    <title>字体标签的测试</title>
</head>
<body>
    <font face="宋体" , color="red", size="8">我是字体标签</font>
</body>
</html>

运行结果：
在这里插入图片描述

2. 特殊字符：

字符实体有三部分：一个和号 (&)，一个实体名称(或者 # 和一个实体编号)，以及一个分号
在这里插入图片描述
代码示例：把换行单标签以文本的形式输出在页面中，并演示空格的使用

<!DOCTYPE html>				    
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>特殊字符的使用</title>
</head>
<body>							
    &lt;&nbsp;br&nbsp;&gt;
</body>
</html>

运行结果：
在这里插入图片描述
注意：如果未使用特殊字符则HTML对于连续的空白字符（如回车、制表等）只保留一个空格

3.标题标签:

标题标签是从h1到h6，h1最大，h6最小，其中的属性：
align属性是对齐属性，其值：
(1) left 左对齐(默认)
(2) center居中对齐
(3) right右对齐
注意：HTML会自动的在标题上下添加一个空行

代码示例：演示标题的不同等级

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>标题标签</title>
</head>						
<body>
    <h1 align="left">标题1</h1>
    <h2 align="right">标题2</h2>
    <h3 align="center">标题3</h3>
    <h4 >标题4</h4>
    <h5 >标题5</h5>
    <h6 >标题6</h6>
</body>
</html>

运行结果：
在这里插入图片描述

4.超链接：网页中点击之后可以跳转的内容

  a标签代表超链接，其中的属性：

href属性设置链接的地址
target属性可以定义被链接的内容在何处显示：
(1) _self 属性值表示链接在当前页面中打开(默认)
(2) _blank属性值表示链接在新页面中打开

代码示例：演示超链接的使用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>超链接的测试</title>
</head>
<body>
    <a href="http://www.google.com">谷歌</a><br/>
    <a href="http://www.google.com", target="_self">谷歌_self</a><br/>
    <a href="http://www.google.com", target="_blank">谷歌_target</a><br/>
</body>
</html>

运行结果：
在这里插入图片描述
三个链接均可点击并呈现相应效果

5.列表标签

(1) ul标签是无序列表，ol标签是有序列表
type属性可以修改列表前面的符号
(2) li标签是列表项

代码示例：演示列表标签的使用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>列表标签的使用</title>
</head>
<body>
    <ol type="none">
        <li>周杰伦</li>
        <li>昆凌</li>
        <li>海瑟薇</li>
    </ol>						  
    <ul type="none">
        <li>周杰伦</li>
        <li>昆凌</li>
        <li>海瑟薇</li>
    </ul>
</body>
</html>

运行结果：
在这里插入图片描述

6. img标签(单标签)：可以在html页面上显示图片

(1) src属性可以设置图片的路径：
相对路径：
. 表示当前文件所在的目录
… 表示当前文件所在的上一级目录
/ 表示进入目录或打开文件
绝对路径：
http://ip:端口号/工程名/资源路径
(2) width属性可以设置图片的宽度
(3) height属性可以设置图片的高度
(4) border属性可以设置图片边框大小
(5) alt属性可以设置当指定路径找不到图片时，用来代替图片显示的文本内容

代码示例：演示img标签的使用
5.jpg在My Test文件夹下的photo文件夹下
19.jpg在My Test文件夹下
17.jpg在MyTest文件夹的上层目录下
即：
在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>照片代码演示</title>
</head>
<body>
    <img src="19.jpg" border="1" height="200" width="200"/>
    <img src="./photo/5.jpg" alt="图片找不到"/>
    <img src="../17.jpg" alt="图片找不到">
</body>
</html>

运行结果：在页面上成功加载出三张图片

7. 表格标签

table标签是表格标签
(1) border属性设置表格最外层边框的大小，如果不设置或值为0则无表格外层边框，亦无单元格边框，仅有数据，且按照表格方式排列
(2) width属性设置表格宽度
(3) height属性设置表格高度
(4) align属性设置表格相对于页面的对齐方式
(5) cellspacing属性设置单元格间距，设置为0单元格的边重叠，会加粗
(6) cellpadding属性设置单元格内容距离单元格边框的距离大小
tr标签是行标签，其中的内容都在一行
th标签是表头标签，其中的内容在单元格中(自动的加粗并居中)
td标签是单元格标签，其中的内容在单元格中，写几个td标签一行中就有几个单元格
align属性设置单元格文本对齐方式
b标签是加粗标签

代码示例：演示制作一个两行三列的表格

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表格标签测试</title>
</head>
<body>
    <!-- 1.做一个带表头的两行三列的表格-->
    <table align="center" border="10" width="30" height="30" cellspacing="5">
        <tr>
            <th>1.1</th>
            <th>1.2</th>
            <th>1.3</th>
        </tr>					    
        <tr>
            <td><b>2.1</b></td>
            <td align="center">2.2</td>
            <td>2.3</td>
        </tr>
    </table>
</body>
</html>

运行结果：
在这里插入图片描述

8. 跨行跨列表格

单元格的 colspan属性设置跨几列
rowspan属性设置跨几行

代码示例：演示表格跨行跨列

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>跨行跨列测试</title>
</head>
<body>
    <table border="1">
        <tr>
            <td colspan="2">1.1</td>
            <td>1.3</td>
        </tr>
        <tr>
            <td rowspan="2">2.1</td>
            <td>2.2</td>
            <td>2.3</td>			  
        </tr>
        <tr>
            <td>3.2</td>
            <td>3.3</td>
        </tr>
    </table>
</body>
</html>

运行结果：
在这里插入图片描述

9. iframe框架标签(内嵌窗口)

iframe标签可以在页面上开辟一个区域显示一个单独的页面
iframe和a标签组合使用的步骤：

在iframe标签中使用name属性自定义一个名称
将a标签中的target属性值设置为第1步iframe标签的name属性值

代码示例：演示iframe标签的使用：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>iframe标签的使用</title>
</head>
<body>
    <iframe src="跨行跨列测试.html" width="200" height="70" name="go"></iframe>
    <br/>
    <ul>
        <li><a href="表格标签测试.html" target="go">切换至表格标签测试</a></li>
    </ul>
</body>
</html>

运行结果：
在这里插入图片描述
点击之后：

10. 表单标签

表单：HTML页面中用来让用户输入信息的所有元素集合，然后把这些信息发送给服务器
(1) form标签代表表单标签
1.action属性设置提交的服务器地址
2. method属性设置提交的方式：get(默认)或post

注意：
A. 表单提交时数据没有发给服务器的三种情况：
1.表单项没有name属性值
2.单选、复选(option标签)没有添加value属性
3.表单项不在提交的form标签中

B. get请求的特点：
1 浏览器地址栏中的地址是action的属性值[?请求参数(表单中的数据)]
2 请求参数的格式是：name=value&name=value，不同数据使用&连接
3 不安全，提交密码会出现在浏览器地址栏中
4.有数据长度的限制：表单值包含非ASCII字符或者超过100个字符，get方式不可再用，必须使用method=“post”

C. post请求的特点：
1.浏览器地址栏中只有action的属性值
2. 相对于get请求更安全
3. 理论上没有数据长度的限制

(2) input标签代表输入标签，用来读取用户的输入
①value属性：
在这里插入图片描述
②name属性：自定义input元素的名称，用于对提交到服务器后的表单数据进行标识
③type属性：

1.text属性值代表文本域：value属性设置默认内容
2. password属性值代表密码输入框(输入的内容以掩码形式显示)：
3. radio属性值代表单选框：checked=”checked”表示默认选中，自定义name
属性可对其进行分组，同名组内只可选中一个
4. checkbox属性值代表复选框：
checked=”checked”表示默认选中
5. reset属性值代表重置按钮：value属性可以修改按钮上的默认文本，
reset按钮可重置表单中的内容，恢复为默认值
6. submit属性值代表提交按钮：value属性可以修改按钮上的默认文本，
submit按钮可将表单数据提交到服务器
7. button属性值代表按钮：value属性可以修改按钮上的默认文本
8. file属性值代表文件上传域：可选择本地的文件上传到服务器
9. hidden属性值代表隐藏域：在页面无任何内容，这些内容不需要用户参与，提交的时候同时发给服务器

(3) select标签代表下拉列表框：
option标签是下拉列表框中的选项，selected="selected"设置默认选中

(4) textarea标签代表多行文本输入框(框中默认值是此标签中的内容)：
1.rows属性可以设置显示几行的高度
2. cols属性可以设置每行可以显示几个字符

代码示例：创建如图所示的表单
在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单的测试</title>
</head>
<body>
    <form action="http://locolhost:3306" method="get">
        <input type="hidden" name="action" value="login"/>
        <h1 align="center">用户注册</h1>
        <table align="center" border="1">
            <!--之后单元格的内容都要放在td中，否则内容就不在表格中了-->
            <tr>
                <td>用户名称:</td>
                <td>
                    <input type="text" name="username" value="默认值"/>
                </td>
            </tr>
            <tr>
                <td>用户密码：</td>
                <td>
                    <input type="password" name="password" value="***"/>
                </td>
            </tr>
            <tr>
                <td>性别：</td>
                <td>
                    <input type="radio" name="sex" value="boy"/>男
                    <input type="radio" name="sex" checked="checked" value="girl"/>女
                </td>
            </tr>
            <tr>
                <td>兴趣爱好：</td>
                                <td>
                    <input name="hobby" type="checkbox" checked="checked" value="Java"/>Java
                    <input name="hobby" type="checkbox" value="JavaScript"/>JavaScript
                    <input name="hobby" type="checkbox" value="C++"/>C++
                </td>
            </tr>
            <tr>
                <td>国籍：</td>
                <td>
                    <select>
                        <option value="none">--默认值是第一个option的内容--</option>
                        <option value="China">中国</option>
                        <option value="Japan">中华</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>自我评价：</td>
                <td>
                    <textarea rows="10" cols="20" name="Describe">默认值为空</textarea>
                </td>
            </tr>
            <tr>
                <td><input type="reset"/></td>
                <td>
                    <input type="submit"/>
                    <input type="file">
                </td>
            </tr>
        </table>
    </form>
</body>
</html>

此表单点击提交之后浏览器地址栏的内容是：
http://locolhost:3306/?action=login&username=%E9%BB%98%E8%AE%A4%E5%80%BC&password=***&sex=girl&hobby=Java&Describe=%E9%BB%98%E8%AE%A4%E5%80%BC%E4%B8%BA%E7%A9%BA

七、其他标签

1.div标签：字符无论多少独占一行
2.span标签：其长度是封装数据的长度，即字符有多长标签就有多长
3.p标签：段落标签，默认会在字符的上下行各空出一行(如果有空行就不再多留空行)

代码示例：测试其他标签的使用

<div>div标签1</div>
<div>div标签2</div>
<span>span标签1</span><!--有一个空格的原因：与下一段字符有大量空白-->
<span>span标签2</span>				
<p>p标签1</p>
<p>p标签2</p>

运行结果：
在这里插入图片描述

CSS

一、CSS技术介绍

CSS用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言

二、CSS语法规则

在这里插入图片描述

浏览器根据选择器决定受CSS样式影响的HTML元素(标签)
属性是需要更改的样式名，每个属性都有一个值。属性和值使用冒号分开，并被大括号包围
如果要定义多个属性的声明，需要使用分号将每个声明分开
一般每行只描述一个属性
CSS注释：/注释的内容/

三、CSS和HTML结合的方式

在标签的style属性上设置”属性：值”

代码示例：使用style属性修改标签的样式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <!--定义一个div标签，修改标签的样式为：边框1个像素，实线，红色-->
    <div style="border: 1px solid red">div</div>
</body>							
</html>

运行结果：
在这里插入图片描述
此种方式的缺点：
(1) 若标签过多，代码量巨大
(2) 无复用性可言
(3) 可读性较差

在head标签中使用style标签来定义各种自己需要的CSS样式：

代码示例：在head标签中使用style标签定义CSS样式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--style标签专门用来定义CSS样式-->
    <style type="text/css">
            /*分别定义div、span标签，修改二者样式为边框1个像素，实线，红色*/
        div{
    
             border: 1px solid red;
        }
        span{
    
           border: 1px solid red;
        }
    </style>
</head>
<body>
    <!--在head标签中定义了某种标签的样式，
    则使用此标签时标签中的内容自动使用所定义的样式-->
    <div>div</div>
    <span>span</span>				
</body>
</html>

运行结果：
在这里插入图片描述
此种方式的缺点：只能在同一页面内复用代码，需要到每个页面修改样式，维护起来不方便

把CSS样式写成一个单独的CSS文件，再通过link标签引入

(1) 创建CSS文件：
在这里插入图片描述
(2) 在HTML文件的head标签中使用：
<link rel = “stylesheet” type = “text/css” href = “创建的CSS文件路径”/>

代码示例：演示link标签的使用
①创建mycss.css文件

div{
    
    border: 1px solid red;
}
span{
    
    border: 1px solid #433cfa;
}

②在html文件中使用link标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" type="text/css" href="mycss.css"/>
</head>
<body>
    <div>div</div>

    <span>span</span>
</body>
</html>

运行结果：
在这里插入图片描述

四、CSS选择器

1.标签名选择器：相当于HTML和CSS结合的方式二
2. id选择器：可以通过id属性选择性的使用某个样式(id是唯一的，每个id值在一个页面中只能使用一次)，格式：
#id名称{
属性：值；
}

代码示例：演示id选择器的使用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
        #id001{
    
            color: burlywood;
            border: 1px solid red;
        }
        #id002{
    
            color: aqua;
            border: 3px yellow;			
        }
    </style>
</head>
<body>							
    <div id="id001">div1</div>
    <div id="id002">div2</div>
    <!--再次使用id报错：<div id="id002">div3</div> -->
</body>
</html>

运行结果：
在这里插入图片描述
3. class选择器(类选择器)：可以通过class属性选择性的使用某个样式(class值在一个页面中可以使用多次)，格式：
.class名称{
属性：值；
}

代码示例：演示类选择器的使用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
           .class01{
    
            color: aqua;			 
            font-size: 30px;
        }
    </style>					
</head>
<body>
    <div class="class01">div1</div>
    <div class="class01">div2</div> <!--可重用-->
</body>
</html>

运行结果：
在这里插入图片描述
4. 组合选择器：可以让多个选择器共用同一个CSS样式
格式：
选择器1，选择器2…选择器n{
属性：值；
}

代码示例：演示组合选择器的使用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
        .class01,#id01{
    
            color: #433cfa;
            font-size: 20px;			 
        }
    </style>
</head>						    运行结果：
<body>
    <div class="class01">div1</div>
    <div id="id01">div2</div>
</body>
</html>

五、查阅CSS手册

其余的用法差不多，这么多样式也记不住，需要查阅手册，手册文件可以私聊我获取
在这里插入图片描述

本文链接：https://blog.csdn.net/weixin_49343190/article/details/107314236

原作者删帖不实内容删帖广告或垃圾文章投诉

智能推荐

python青果教务系统抢课_名额不够，技术来凑，利用Python实现教务系统强制性抢课...-程序员宅基地

文章浏览阅读1.3k次。最近一学期一次的抢课大戏又来了，几家欢乐几家愁。O(∩_∩)O哈哈~(l我每次一选就过了hah，我还是有欧的时候滴)。看着他们盯着教务系统就着急，何况我们那教务系统，不想说什么。emmm 想周围的朋友，正好下午利用扩容前一段时间写了个小脚本帮助朋友抢课。(当然抢到了啦，^_^)私信小编001即可获取大量Python学习资料，名额有限因为时间不够，来不及仔细琢磨，我第一想法就是直接提交选课的数据包(..._青果教务系统抢课

windows 加 switchyomega + burp 抓https包-程序员宅基地

文章浏览阅读4.6k次。很简单，下载证书后导入到受信任根目录证书下载，直接在代理状态浏览器访问burp点击CA就可以下载了设置该证书全部信任，，switchyomega 设置如下即可就可以抓https的包了 ...

用C语言写循环赛日程表,循环赛的方法与编排-程序员宅基地

文章浏览阅读1k次。一、循环赛的种类与特点(一)循环赛的种类循环赛又称循环法。是指参赛队(或个人，下同)之间，都要互相轮流比赛，最后按照各参赛队在全部比赛中的胜负场数、得分多少排定名次的比赛方法。它在对抗性项目比赛中经常被采用。循环赛包括单循环、双循环或分组循环三种。单循环是所有参赛队(人)相互轮赛一次；双循环是所有参赛队(人)相互轮赛二次；分组循环是参赛队(人)较多时，采用种子法，把强队(人)分散在各组，先进行小组..._c语言循环赛互打一场比赛甲队两胜

springboot项目访问html页面，发现端口不一致&继承WebMvcConfigurationSupport类会导致自动配置失效_springboot项目前端端口号不同怎么办-程序员宅基地

文章浏览阅读1.6k次，点赞4次，收藏6次。最后的解决方法“在config--WebMvcConfig中不要继承WebMvcConfigurationSupport,而是实现WebMvcConfigurer接口”，且不要在idea中直接点击浏览器图标打开对应的html页面，要自己在浏览器输入url。在本次debug过程中，更加清楚地明白了，springboot项目启动过程中，只扫描引导类同包或子包下的程序，而在resources目录下的静态资源文件(没放到)，需要被映射，才能被扫描到。_springboot项目前端端口号不同怎么办

k8s.配置管理.configmap&secret_configmap @value-程序员宅基地

文章浏览阅读80次。configmap 和secret 都需要提前创建configmap和secret都可以为pod提供挂载和变量的方式变量的方式有envfrom全部变量和valuefrom单个变量的引用configmap和secret 需要和引用的pod或者资源对象在同一个ns下。_configmap @value

System.TypeInitializationException: 'The type initializer for 'MySql.Data.MySqlClient.Replication.Re...-程序员宅基地

文章浏览阅读2.2k次。下午在调试的时候报错数据库连接就报错我就很纳闷后面用原来的代码写发现还是报错System.TypeInitializationException:'The type initializer for 'MySql.Data.MySqlClient.Replication.ReplicationManager' threw an exception.'应该是出在Mysql包上的问题..._system.typeinitializationexception:““mysql.data.mysqlclient.mysqlpoolmanag

随便推点

汇编指令长度计算_汇编指令占多少字节-程序员宅基地

文章浏览阅读5.1k次，点赞11次，收藏58次。指令长度与寻址方式有关系，规律或原则如下：一、没有操作数的指令，指令长度为1字节。如es:ds:cbwxlat等。二、操作数只涉及寄存器的指令，指令长度为2字节。如mov al,[si]mov ax,[bx+si]mov ds,ax等。三、操作数涉及内存地址的指令，指令长度为3字节。如mov al,[bx+1]mov ax,[bx+si+3]lea di,[1234]mov [2345],ax等。四、操作数涉及立即数的指令，指令长度为：寄存器类型+2。8位寄存器，寄存器_汇编指令占多少字节

二、RSA加密_ctf rsa 多个n和多个c-程序员宅基地

文章浏览阅读3.4k次。CTF中的RSA及攻击方法笔记1 数论基础1.1 模运算规则2 RSA相关题目2.1 已知 n，e，c 求 m2.2 已知 p，q，e 求 d2.3 已知dp，dq，c，p，q 求m2.4 仅已知c，c特别大【c = m^e mod n】2.5 已知n1，n2，c1，c2，n 求 m2.6 已知n1，n2，e，c2 求m2.7 已知e，d，N 求p，q1 数论基础参考链接：https://www.freebuf.com/articles/web/257835.html1.1 模运算规则模运算与基_ctf rsa 多个n和多个c

mysql中把bigint类型转换为时间格式，与hive中unix_timestamp、FROM_UNIXTIME两个函数之间的区别_bigint转日期-程序员宅基地

文章浏览阅读2w次，点赞4次，收藏15次。数据库中时间类型是这样的，13位bigInt类型的数据select date_format(FROM_UNIXTIME(列名/1000),'%Y%m%d') from xx表原理就是把13位的时间格式/1000等于时间戳，使用FROM_UNIXTIME把时间戳转换成具体的日期ps：将时间转换为时间戳select unix_timestamp('2018-08-30..._bigint转日期

exit status 5: �ܾ��ʡ� exit status 1: ��_exit status 5: exit status 1:-程序员宅基地

文章浏览阅读1.1k次。使用nvm切换node版本出现上述乱码时。使用管理员模式打开CMD就可以解决了~_exit status 5: exit status 1:

对Java和Linux的认识,Java类的认识-程序员宅基地

文章浏览阅读279次。Java使用类来构造自己的数据类型，类其实就是对一类数据和行为的数据封装；可以达到低耦合功能；Java注意啦：用类也是我们为了定义自己数据类型的一种方法，所以结构体，共用体也是一样的；都是为了处理数据而用的方法！类的存放问题： java源代码文件是以类为中心的，一个类的定义源码必须只在一个源文件实现；一个“文件名.java”文件名必须与文件中用public class 修饰的类名一致，java语法..._linux和java

快给你的Vue项目添加一个编辑图片组件吧_vue-image-editor-程序员宅基地

文章浏览阅读8.2k次，点赞20次，收藏59次。快给你的Vue项目添加一个编辑图片组件吧给大家推荐一款功能极其强大的图片编辑插件 tui.image-editor快速体验首选在你的前端项目中安装：npm i tui-image-editor// oryarn add tui-image-editor现在你就去新建一个.vue文件，复制进去下面这段代码：<template> <div id="tui-image-editor"></div></template><scr_vue-image-editor