实习期间，博主快速搭建了一个个人博客，虽然目前功能和设计显得较为简单，但计划逐步完善。博客包括首页、图片展示、日志发布和留言板等模块，是博主学习和提升技能的平台。
实习要求几天内弄出一个博客，总结就是自己弱爆了，应该多和大神们学习，毕竟要学的还有很多。
然后就是弱爆了的一个小博客吧。想日后将其功能逐渐完善。
目前有很多功能和外表都是很low的。
效果图在我的博客相册里可以看到，我就不贴了。
然后是代码
首页
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>TchChan的博客</title>
<link href="style.css" rel="stylesheet" type="text/css" media="all">
</head>
<style>
</style>
<body >
<div class="nav">
<ul>
<li><a href="index.php">首页</a></li>
<li><a href="images.php">图片</a></li>
<li><a href="journal.php">日志</a></li>
<li><a href="message.php">留言板</a></li>
<li><a href="infor.php">我的信息</a></li>
<div class="clear">
</div>
</ul>
</div>
<div>
<center>
<form style="margin-top:400px;">
<input id="search" type="text" placeholder="搜索关键字">
</form>
</center>
</div>
</body>
</html>
图片
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>TchChan的博客</title>
<link href="style.css" rel="stylesheet" type="text/css" media="all">
</head>
<body>
<div class="nav">
<ul>
<li><a href="index.php">首页</a></li>
<li><a href="images.php">图片</a></li>
<li><a href="journal.php">日志</a></li>
<li><a href="message.php">留言板</a></li>
<li><a href="infor.php">我的信息</a></li>
<div class="clear">
</div>
</ul>
</div>
<script>
function add(){
window.open("doAddimages.php","_blank","toolbar=no,channelmode=yes, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width=400, height=400,top=300, left=700,");
}
</script>
<div style="margin-left:410px;width:600px;height:30px;padding-top:40px;padding-left: 500px;margin-top: 60px;"><font color="#773E8A">我的相册</font></div>
<div id="images"style="margin-left: 410px;margin-top:40px;width:1100px;height:700px;border:1px solid red;">
<div style="height:50px;margin-left: 20px;margin-top: 20px;">
<a href="#" onclick="add()">添加图片</a>
</div>
<?php
$info = file_get_contents("images.txt");
$info = rtrim($info,"@");
if(strlen($info)>0){
$lylist = explode("@@@",$info);
foreach($lylist as $v){
echo "<div style='float:left;margin:9px;'>";
echo "<img src='{$v}' width='200' height='200' alt='路径错误' /> ";
echo "<div style='height:20px;padding-left:78px;'>{$v}</div>";
echo "</div>";
}
}
?>
<div class="clear"></div>
</div>
</body>
</html>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>TchChan的博客</title>
<link href="style.css" rel="stylesheet" type="text/css" media="all">
</head>
<body>
<div id="images" style="padding-left:120px;padding-top:170px;width:400px;height:400px;">
<form action="upload_file.php" method="post"enctype="multipart/form-data">
<input type="file" name="file" id="file"/>
<br/>
<input type="submit" name="submit" value="Submit"/>
</form>
</div>
</body>
</html><?php
if ($_FILES["file"]["error"] > 0)
{
echo "Error: " . $_FILES["file"]["error"] . "<br/>";
}
else
{
echo "Upload: " . $_FILES["file"]["name"] . "<br/>";
echo "Stored in: " . $_FILES["file"]["tmp_name"];
$image_address="" . $_FILES["file"]["name"];
echo $image_address;
$address = "{$image_address}@@@";
$info = file_get_contents("images.txt");
file_put_contents("images.txt",$info.$address);
}
?>
日志
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>TchChan的博客</title>
<link href="style.css" rel="stylesheet" type="text/css" media="all">
</head>
<body>
<div class="nav">
<ul>
<li><a href="index.php">首页</a></li>
<li><a href="images.php">图片</a></li>
<li><a href="journal.php">日志</a></li>
<li><a href="message.php">留言板</a></li>
<li><a href="infor.php">我的信息</a></li>
<div class="clear">
</div>
</ul>
</div>
<div id="journal" style="margin-left:430px;margin-top:150px;border:1px solid red;width:1100px;">
<div style="border-bottom:1px solid red;padding-bottom: 10px;padding-top: 10px "><font color="blue">我的日志</font></div>
<div>
<a href="new_journal.php">新日志</a>
</div>
<table width = "1100" >
<tr>
<th style="text-align:left;padding-bottom:10px;padding-top:10px;" ><font color="##2DF00F">日志标题</font></th>
<th style="width:50px;padding-right: 30px;"><font color="#B71A1D";>操作</font></th>
<script type="text/javascript">
function view(id){
window.location ='Showjournal.php?id='+id;
}
</script>
<?php
$info = file_get_contents("rizhi.txt");
$info = rtrim($info,"@");
$lylist = explode("@@@",$info);
if(strlen($info)>3){
foreach($lylist as $k=>$v){
$rizhi = explode("##",$v);
echo "<tr>";
echo "<td style='text-align:left;padding-bottom:5px;padding-top:10px;'><a href = 'javascript:view({$k})'>{$rizhi[0]}<a/></td>";
echo "<td ><a href = 'javascript:dodel({$k})'>删除</a></td>";
echo "</tr>";
}
}
?>
</table>
</div>
</body>
</html><!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>TchChan的博客</title>
<link href="style.css" rel="stylesheet" type="text/css" media="all">
</head>
<body>
<div class="nav">
<ul>
<li><a href="index.php">首页</a></li>
<li><a href="images.php">图片</a></li>
<li><a href="journal.php">日志</a></li>
<li><a href="message.php">留言板</a></li>
<li><a href="infor.php">我的信息</a></li>
<div class="clear">
</div>
</ul>
</div>
<?php
$title_value = $_POST["title_value"];
$content_value = $_POST["content_value"];
if (strlen($title_value)<1) {
echo "<script language=\"JavaScript\">alert(\"标题不能为空\");</script>";
}
if (strlen($content_value)<1) {
echo "<script language=\"JavaScript\">alert(\"内容不能为空\");</script>";
}
else
{$rizhi = "{$title_value}##{$content_value}@@@";
$info = file_get_contents("rizhi.txt");
file_put_contents("rizhi.txt",$info.$rizhi);
echo "</br>";
echo "<script language=\"JavaScript\">alert(\"提交成功\");</script>";
$url ="http://localhost/php_test/journal.php";
echo "<script language='javascript' type='text/javascript'>";
echo "window.location.href='$url'";
echo "</script>";
}
?>
</body>
</html>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>TchChan的博客</title>
<link href="style.css" rel="stylesheet" type="text/css" media="all">
</head>
<body>
<div class="nav">
<ul>
<li><a href="index.php">首页</a></li>
<li><a href="images.php">图片</a></li>
<li><a href="journal.php">日志</a></li>
<li><a href="message.php">留言板</a></li>
<li><a href="infor.php">我的信息</a></li>
<div class="clear">
</div>
</ul>
</div>
<div id="new_journal" style="margin-left:430px;margin-top:150px;border:1px solid red;width:1100px;">
<div style="border-bottom:1px solid red;">写日志</div>
<form action = "doAddjournal.php" method = "post">
<div id="new_rizhi">
<div id="title">
<textarea name="title_value" style="width:298px;resize:none;padding-left: 400px;padding-right:400px;">
</textarea>
</div>
<div id="content">
<textarea name="content_value" style="width:1094px;height:600px;resize:none;">
</textarea>
</div>
</div>
<input type = "submit" value = "提交">
<input type = "reset" value = "重置"></td>
</form>
</div>
</body>
</html>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>TchChan的博客</title>
<link href="style.css" rel="stylesheet" type="text/css" media="all">
</head>
<body>
<div class="nav">
<ul>
<li><a href="index.php">首页</a></li>
<li><a href="images.php">图片</a></li>
<li><a href="journal.php">日志</a></li>
<li><a href="message.php">留言板</a></li>
<li><a href="infor.php">我的信息</a></li>
<div class="clear">
</div>
</ul>
</div>
<?php
$id = $_GET["id"];
$info = file_get_contents("rizhi.txt");
$lylist = explode("@@@",$info);
$content=$lylist[$id];
$con = explode("##",$content);
echo '<div style="margin-left:430px;margin-top:150px;border:1px solid red;width:1100px;">';
echo "<div style='padding-left:460px;padding-right:340px;border:1px solid red;width:298px;height:60px;'>{$con[0]}</div>";
echo "<div style='border:1px solid red;width:1098px;height:800px;'>{$con[1]}</div>";
echo "</div>"
?>
</body>
</html>
留言板
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>TchChan的博客</title>
<link href="style.css" rel="stylesheet" type="text/css" media="all">
<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js">
</script>
</head>
<body>
<div class="nav">
<ul>
<li><a href="index.php">首页</a></li>
<li><a href="images.php">图片</a></li>
<li><a href="journal.php">日志</a></li>
<li><a href="message.php">留言板</a></li>
<li><a href="infor.php">我的信息</a></li>
<div class="clear">
</div>
</ul>
</div>
<div id="message">
<div style="background-color:red; width:1300px;margin:0 auto;height:27px">
<text style="font-size:22px;color:blue;line-height:25px;">留言板</text>
</div>
<div id="message_header">
<text style="font-size:16px">主人寄语</text>
<script>
$(document).ready(function(){
$("#bjjy").click(function(){
$("#add_jiyu").show();
$("#show_jiyu").hide();
$("#create_m").hide();
$("#button_create").hide();
});
});
</script>
<button id="bjjy" >编辑你的寄语</button>
</div>
<div id="add_jiyu" style="border:1px solid pink;display:none;height:300px;">
<textarea id="value_jiyu" style="width:1292px;height:294px;"></textarea>
<script>
$(document).ready(function(){
$("#sub_jiyu").click(function(){
var value_jiyu=$("#value_jiyu").val();
if(value_jiyu=="")
alert('文字不能为空');
else
{
alert('提交成功');
var value_jiyu=$("#value_jiyu").val();
$("#show_jiyu").html(value_jiyu);
$("#add_jiyu").hide();
$("#show_jiyu").show();
}
$("#button_create").show();
});
});
</script>
<script>
function sub_file(){
}
</script>
<script>
$(document).ready(function(){
$("#cancel_jy").click(function(){
var show_jiyu_value=$("#show_jiyu").text();
$("#show_jiyu").html(show_jiyu_value);
$("#value_jiyu").val(show_jiyu_value);
$("#add_jiyu").hide();
$("#show_jiyu").show();
});
});
</script>
<div>
<button id="sub_jiyu" type="submit" value="submit" onclick="sub_file()">提交</button>
<button id="cancel_jy">取消</button>
</div>
</div>
<div id="show_jiyu" style="border:1px solid blue;width:1298px;height:200px;white-space:normal;word-break:break-all;background:url(timg1.jpg);background-size:100%">
</div>
<script>
$(document).ready(function(){
$("#want_liuyan").click(function(){
$("#create_m").show();
});
});
</script>
<div id="button_create">
<button id="want_liuyan">我要留言</button>
</div>
<div id="create_m" style="word-break: break-all;display:none;">
<textarea id="value_message" style="width:1293px;height:200px;background-image: url(timg2.jpg)"></textarea>
<script>
function sub_new(){
var new_message=document.createElement("div");
new_message.style.border="1px solid red";
new_message.style.wordBreak="break-all";
new_message.style.paddingTop="10px";
new_message.style.paddingBottom="10px";
var value_message=document.getElementById("value_message");
var node=document.createTextNode(value_message.value);
new_message.appendChild(node);
var message=document.getElementById("message");
var first_dom=message.children;
message.insertBefore(new_message,first_dom[6]);
//message.appendChild(new_message);
}
$(document).ready(function(){
$("#sub_new").click(function(){
$("#create_m").hide();
});
});
</script>
<button id="sub_new" onclick="sub_new()">提交</button>
<script>
$(document).ready(function(){
$("#cancel_new").click(function(){
$("#create_m").hide();
});
});
</script>
<button id="cancel_new">取消</button>
</div>
</div>
</body>
</html>
个人档
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>TchChan的博客</title>
<link href="style.css" rel="stylesheet" type="text/css" media="all">
<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js">
</script>
</head>
<body>
<div class="nav">
<ul>
<li><a href="index.php">首页</a></li>
<li><a href="images.php">图片</a></li>
<li><a href="journal.php">日志</a></li>
<li><a href="message.php">留言板</a></li>
<li><a href="infor.php">我的信息</a></li>
<div class="clear">
</div>
</ul>
</div>
<div id="inf_main">
<div id=inf_header>
<text>个人档</text>
</div>
<div id="inf_left">
<div id="inf_images">
<img src="1.jpg" style="width:200px;height:200px;">
</div>
<br>
<a href="#" id="inf_alter_images">修改头像</a>
<div id="inf_smpile">
<div id="inf_journal">
<a href="journal.php"><text>日志</text></a>
</div>
<div id="inf_photo">
<a href="images.php"><text>照片</text></a>
</div>
</div>
<div class="clear">
</div>
<hr style="width: 200px;">
</div>
<div id="inf_right">
<div style="margin-left:15px; margin-top:5px;">
<text style="font-size:25px;">Chan</text>
<a href="http://www.runoob.com/" style="margin-left:20px;margin-top:5px;" target="_black">菜鸟教程</a>
<a href="" style="margin-left:20px;margin-top:5px;"></a>
</div>
<br>
<script>
$(document).ready(function(){
$("#p_ziliao").click(function(){
$("#ziliao").show();
$("#aihao").hide();
});
});
</script>
<button id="p_ziliao">个人资料</button>
<script>
$(document).ready(function(){
$("#p_aihao").click(function(){
$("#ziliao").hide();
$("#aihao").show();
});
});
</script>
<button id="p_aihao">兴趣爱好</button>
<div id="ziliao">
<script>
$(document).ready(function(){
$("#xiugai1").click(function(){
$("#inf1_show").hide();
$("#inf1_xiugai").show();
});
});
</script>
<div style="height:20px;border-bottom: 1px solid black;"><text style="margin-right:600px;margin-left:20px;">基本资料</text><a id="xiugai1" href="#"><font color="#EF161A">修改</font></a></div>
<div id="inf1_show">
<table cellspacing="20px;">
<tr>
<td>性别</td>
<td id="out_sex"></td>
</tr>
<tr >
<td>年龄</td>
<td id="out_age"></td>
</tr>
<tr>
<td>生日</td>
<td id="out_birth"></td>
</tr>
<tr >
<td>星座</td>
<td id="out_con"></td>
</tr>
<tr >
<td>现居地</td>
<td id="out_place"></td>
</tr>
<tr >
<td>婚姻状况</td>
<td id="out_marriage"></td>
</tr>
<tr >
<td>故乡</td>
<td id="out_hometown"></td>
</tr>
</table>
</div>
<div id="inf1_xiugai" style="display:none">
<table cellspacing="20px;">
<tr>
<td>性别</td>
<td><input id="in_sex" type="text"></input></td>
</tr>
<tr >
<td>年龄</td>
<td><input id="in_age" type="text"></input></td>
</tr>
<tr>
<td>生日</td>
<td><input id="in_birth" type="text"></input></td>
</tr>
<tr >
<td>星座</td>
<td><input id="in_con" type="text"></input></td>
</tr>
<tr >
<td>现居地</td>
<td><input id="in_place" type="text"></input></td>
</tr>
<tr >
<td>婚姻状况</td>
<td><input id="in_marriage" type="text"></input></td>
</tr>
<tr >
<td>故乡</td>
<td><input id="in_hometown" type="text"></input></td>
</tr>
</table>
<script>
$(document).ready(function(){
$("#sub1_f").click(function(){
var in_sex=$("#in_sex").val();
var in_age=$("#in_age").val();
var in_birth=$("#in_birth").val();
var in_con=$("#in_con").val();
var in_place=$("#in_place").val();
var in_marriage=$("#in_marriage").val();
var in_hometown=$("#in_hometown").val();
$("#out_sex").html(in_sex);
$("#out_age").html(in_age);
$("#out_birth").html(in_birth);
$("#out_con").html(in_con);
$("#out_place").html(in_place);
$("#out_marriage").html(in_marriage);
$("#out_hometown").html(in_hometown);
$("#inf1_show").show();
$("#inf1_xiugai").hide();
});
});
</script>
<button id="sub1_f">提交</button>
<script>
$(document).ready(function(){
$("#show1_f").click(function(){
var out_sex=$("#out_sex").text();
var out_age=$("#out_age").text();
var out_birth=$("#out_birth").text();
var out_con=$("#out_con").text();
var out_place=$("#out_place").text();
var out_marriage=$("#out_marriage").text();
var out_hometown=$("#out_hometown").text();
$("#in_sex").val(out_sex);
$("#in_age").val(out_age);
$("#in_birth").val(out_birth);
$("#in_con").val(out_con);
$("#in_place").val(out_place);
$("#in_marriage").val(out_marriage);
$("#in_hometown").val(out_hometown);
$("#inf1_show").show();
$("#inf1_xiugai").hide();
});
});
</script>
<button id="show1_f">取消</button>
</div>
</div>
<div id="aihao" style="display:none;">
<script>
$(document).ready(function(){
$("#xiugai2").click(function(){
$("#inf2_show").hide();
$("#inf2_xiugai").show();
});
});
</script>
<div style="height:20px;border-bottom: 1px solid black;"><a style="margin-left:684px" id="xiugai2" href="#">修改</a></div>
<div id="inf2_show">
<table cellspacing="20px;">
<tr>
<td>明星</td>
<td id="out_mingxing"></td>
</tr>
<tr >
<td>音乐</td>
<td id="out_music"></td>
</tr>
<tr>
<td>影视</td>
<td id="out_movie"></td>
</tr>
<tr >
<td>运动</td>
<td id="out_sports"></td>
</tr>
<tr >
<td>游戏</td>
<td id="out_game"></td>
</tr>
<tr >
<td>电子</td>
<td id="out_elect"></td>
</tr>
<tr >
<td>其他</td>
<td id="out_other"></td>
</tr>
</table>
</div>
<div id="inf2_xiugai" style="display:none">
<table cellspacing="20px;">
<tr>
<td>明星</td>
<td><input id="in_mingxing" type="text"></input></td>
</tr>
<tr >
<td>音乐</td>
<td><input id="in_music" type="text"></input></td>
</tr>
<tr>
<td>影视</td>
<td><input id="in_movie" type="text"></input></td>
</tr>
<tr >
<td>运动</td>
<td><input id="in_sports" type="text"></input></td>
</tr>
<tr >
<td>游戏</td>
<td><input id="in_game" type="text"></input></td>
</tr>
<tr >
<td>电子</td>
<td><input id="in_elect" type="text"></input></td>
</tr>
<tr >
<td>其他</td>
<td><input id="in_other" type="text"></input></td>
</tr>
</table>
<script>
$(document).ready(function(){
$("#sub2_f").click(function(){
var in_mingxing=$("#in_mingxing").val();
var in_music=$("#in_music").val();
var in_movie=$("#in_movie").val();
var in_sports=$("#in_sports").val();
var in_game=$("#in_game").val();
var in_elect=$("#in_elect").val();
var in_other=$("#in_other").val();
$("#out_mingxing").html(in_mingxing);
$("#out_music").html(in_music);
$("#out_movie").html(in_movie);
$("#out_sports").html(in_sports);
$("#out_game").html(in_game);
$("#out_elect").html(in_elect);
$("#out_other").html(in_other);
$("#inf2_show").show();
$("#inf2_xiugai").hide();
});
});
</script>
<button id="sub2_f">提交</button>
<script>
$(document).ready(function(){
$("#show2_f").click(function(){
var out_mingxing=$("#out_mingxing").text();
var out_music=$("#out_music").text();
var out_movie=$("#out_movie").text();
var out_sports=$("#out_sports").text();
var out_game=$("#out_game").text();
var out_elect=$("#out_elect").text();
var out_other=$("#out_other").text();
$("#in_mingxing").val(out_mingxing);
$("#in_music").val(out_music);
$("#in_movie").val(out_movie);
$("#in_sports").val(out_sports);
$("#in_game").val(out_game);
$("#in_elect").val(out_elect);
$("#in_other").val(out_other);
$("#inf2_show").show();
$("#inf2_xiugai").hide();
});
});
</script>
<button id="show2_f">取消</button>
</div>
</div>
</div>
</body>
</html>
扫一扫
1112
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
