常用HTML+CSS属性

    技术2022-07-10  142

    内嵌CSS样式

    <p style="color: #AD5D0F;font-weight:bold;font-size: 30px; font-family: '宋体';" align="center">内联样式</p>

    换行和空格

    换行 </br> 空格  

    行距

    line-height: 48px;

    分割线

    <hr>

    下划线

    <u> </u>

    字体

    <font color="#FF0000">我是红色字体</font> <font size=4>我是变大的字</font>

    注释

    <!-- 这是注释 -->

    文本格式化

    <b>粗体文本</b> <code>计算机代码</code> <em>强调文本</em> <i>斜体文本</i> <kbd>键盘输入</kbd> <pre>预格式化文本</pre> <small>更小的文本</small> <strong>加粗</strong>

    链接

    普通的链接:<a href="https://www.example.com/">链接文本</a> 图像链接: <a href="https://www.example.com/"><img src="URL" alt="替换文本"></a> 邮件链接: <a href="mailto:webmaster@example.com">发送e-mail</a> 书签: <a id="tips">提示部分</a> <a href="#tips">跳到提示部分</a>

    图片

    <img src="URL" alt="替换文本" height="42" width="42">

    样式/区块

    <style type="text/css"> h1 {color:red;} p {color:blue;} </style> <div>文档中的块级元素</div> <span>文档中的内联元素</span>

    无序列表

    <ul> <li>项目</li> <li>项目</li> </ul>

    有序列表

    <ol> <li>第一项</li> <li>第二项</li> </ol>

    定义列表

    <dl> <dt>项目 1</dt> <dd>描述项目 1</dd> <dt>项目 2</dt> <dd>描述项目 2</dd> </dl>

    表格(Tables)

    <table border="1"> <tr> <th>表格标题</th> <th>表格标题</th> </tr> <tr> <td>表格数据</td> <td>表格数据</td> </tr> </table>

    框架(Iframe)

    <iframe src="demo_iframe.htm"></iframe>

    表单(Forms)

    <form action="demo_form.php" method="post/get"> <input type="text" name="email" size="40" maxlength="50"> <input type="password"> <input type="checkbox" checked="checked"> <input type="radio" checked="checked"> <input type="submit" value="Send"> <input type="reset"> <input type="hidden"> <select> <option>苹果</option> <option selected="selected">香蕉</option> <option>樱桃</option> </select> <textarea name="comment" rows="60" cols="20"></textarea> </form>
    Processed: 0.013, SQL: 9