Question

我正在尝试创建一个类似博客的网站，但我无法弄清楚如何在输入元素中对齐文本并使该元素的条目被发布并保存为它下面的段落元素....就像facebook 。我知道这不是一个非常详细的问题，但我不熟悉HTML，Javascript和CSS。

在这里摆弄它。

<head>

    <title font-weight="bold">Social Rejects</title>
    <link href="font-awesome.min.css" rel="stylesheet">

    <link href='font.css' rel='stylesheet' type='text/css'>

    <link href='style.css' rel='stylesheet'>


    <link rel="shortcut icon" href="sr-head-ico.ico" type="image/x-icon">
    <script language="JavaScript" type="text/javascript">
    <!--- PASSWORD PROTECTION SCRIPT

        function TheLogin() {

        var password = '69';

        if (this.document.loginsec.sec.value == password) {
            top.location.href="secret.html";
        }
        else {
        location.href="incorrect.html";
        }
        }

    // End hiding --->
    </script>
</head>

<body>


    <div class="pheader">
        <img src="sr-head.png"></img>
        <right>
        <a href="login.html">Log-In</a>
        </right>
    </div>
        <!-- Main body -->

<div class="jumbotron">


<script src="jquery.min.js"></script>
<script src="app.js"></script>

<div class="nav"
    <ul>
        <li href="index.html">Home</li>
        <li href="#">My Page</li>
        <li href="#">My Followers</li>
        <li href="#">Following</li>
        <li href="#">About S.R.</li>
    </ul>
</div>
<div class="na">
    <div class="nti">Feature not yet added!
    </div>
    <info>This feature has not yet been constructed. Please check back for more info.<br>
    <a style="text-decoration: underline;">These things will be broken for <b>awhile</b>.</a></info><br><br><center>
    <confirm>Okay</confirm>
    </center>
</div>
<div class="secret">
    <div class="nti">Congratulations!
    </div>
    <center>
    Enter Secret password:<br>
        <form name="loginsec" style="margin: 0px">
        <INPUT TYPE="text" NAME="sec" size="24" onKeyDown="if(event.keyCode==13) event.keyCode=9;" style="width: 252px; height: 26px; margin: 5px;"><br>
        <input type="button" value="Click to check" style="width : 150px; margin: 3px; border: 0px; padding: 10px;" onClick="TheLogin(this.form)">
        </form>
    </center><center>
    <confirm>Okay</confirm>
    </center>
</div>
<div class=main-body>
    <ti>Rodney Mahan</ti><br>
    <beta>This page is in beta</beta>

    <div class="profile">
        <div class="header"
        <ul>
            <li><b>About Rodney:</b></li>
            <li>Enjoys <b>Making Websites</b></li>
            <li><b>CEO</b> of <b>Mahan's Web Design</b></li>
            <li>Born on <b>February 4th, 1999</b></li>
        </ul>
        </div>
    </div>
    <div class="blog">
        <blog-title>Rodney's Blog</blog-title><br>
        <form>
        <input placeholder="New Post"></input>
        </form>
    </div>
</div>
</body>

http://jsfiddle.net/MahanWebDesign/bm8fz2u5/1/

Answer 1

首先，擅长处理这样的事情。 Adeneo是对的，它可能比你想象的更复杂。在3个级别中考虑这一点可能会有所帮助：

前端：这是您的HTML，CSS和JavaScript。
中间层：这是您在前端和数据库之间的通信。
后端：数据库，您的商店内容如帖子，用户和＆amp;帐户等。

通常，您的JavaScript将通过像REST这样的API（应用程序编程接口）与中间层进行通信，以实际发送和检索数据。你是对的，这个问题太笼统了。如果你这样做是为了练习，那就是学习这一点，如果你只是试图让某些东西得到运行，那就是另一件事。

如果您只想尝试启动并运行，请尝试查看WordPress.com。它也将为您托管它，并且没有与服务器混淆。

如果您想了解HTML，CSS和JavaScript，可以尝试Wordpress.org。一旦你将它安装在服务器上，就可以为你处理第2层和第3层，它为第1层提供了很多帮助。你可以下载它，然后开始查看它是如何做的。这将涉及一些PHP以及HTML和CSS。

如果您希望了解数据库及其工作原理，可以从简单的Firebase开始。您可以获得免费的开发人员许可证，并开始尝试使用JSON以及其他方式来发送和存储信息。如果你真的想进入数据库结构和交互，MySQL是一个很好的起点。

当然，你不必一次学习，而且很多人只专注于一两层。

如何将输入框中的内容转移到段落元素，如博客

1 个答案: