HTML标签

样例:

<!DOCTYPE html>
<html>
<!-- 头部 -->
<head>
<!-- 文本规格 -->
<meta charset="UTF-8">
<!-- 标题 -->
<title>这是我的第一个页面</title>
<!-- 样式 -->
<style>
<!-- 给所有img赋予样式 宽度 50px -->
    img{width:50px}
<!-- 标签闭合 -->
</style>
</head>
<!-- 主体 -->
<body>
        <h1>我的第一个页面</h1>    
        <p>这是我的第一个页面的第一个<a href="http://www.baidu.com">段落</a></p>
        <h2>星巴克</h2>
        <ul>
            <li>咖啡</li>
            <li>奶茶</li>
            <li>牛奶</li>
            <li>茶
                <ul>
                <li>红茶</li>
                <li>绿茶</li>
                </ul>
            </li>
        </ul>
        <h3>浏览器</h3>
        <img src="C:\Users\Public\Pictures\Sample Pictures\IE浏览器.png" alt="ie"/>
        <img src="C:\Users\Public\Pictures\Sample Pictures\ios浏览器打开.png" alt="ios"/>
        <img src="C:\Users\Public\Pictures\Sample Pictures\UC浏览器.png" alt="UC"/>
        <img src="C:\Users\Public\Pictures\Sample Pictures\浏览器.png" alt="浏览器"/>
        <script>
            document.write('<p>这是我的第一个页面</p>');
        </script>
</body>
</html>

<h1></h1> 标题
系统标签
h1 - h6
6级标签

<p></p>
换行标签

&nbsp
空格

<a></a> 全能标签
<a href="http://www.baidu.com"></a>

注意 所有html语言如果不用换行符 不会自动换行

显示图片
<img src="Desert.jpg">
src 后面链接的是项目的根目录的下级文件
在WebRoot 下建立一个图片文件夹 Images

alt 标签 用于搜索器采集图片内容标签
<img alt = "沙滩" src="Desert.jpg">

HTML元素
a p body html
HTML属性
h1 布局 居中布局
<h1 align="center"> 123456</h1>
<h1 align="center"> 123456</h1>
<h1 align="right"> 123456</h1>
<h1 align="left"> 123456</h1>

背景色彩
<body bgcolor = "bule">

style 样式
<a style ="background: yellow" >hello</a>
font-size 字体大小 之间用分号间隔
px 是像素大小
<a style ="background: yellow; font-size: 40px" >hello</a>

颜色采集器
RGB颜色查询表

十六进制 0-f
16进制 11 = 10进制的17
16进制 b= 10进制的11
16进制 22 = 2*16+2 = 34 (十进制)
可以用java写一个 算法

分割线


div 属性
<div style = "background: blue;text-align: center; width :50%;">
sdfsdfdsdsfsafsafsafsafasfsafsa
dsfsfdsfdsfs</div>

table 表格 需要使用style的话 外面需要加上 div标签
width 宽度标签
height 高度标签
border 框线 solid 实线
<div>
<table style="border: 1px solid red; width: 100%;height: 200px">
<tr >
<td>aa</td>
<td>bb</td>
</tr>
<tr>
<td>cc</td>
<td>dd</td>
</tr>
</table>
</div>

菜单
text-align:center; /设置水平居中/
vertical-align:middle;/设置垂直居中/

内容置顶
valign ="top";
padding-top 内边距
margin-top 上边距
cellspacing ="0px" table 标签内的边距

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • HTML标签解释大全 一、HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(D...
    米塔塔阅读 8,706评论 1 41
  • 序言 整理谷歌的小弟的笔记,版权归原作者所有,本文仅作整理,原文链接:http://blog.csdn.net/l...
    在代码下成长阅读 4,898评论 1 5
  • 在前一篇文章中已经简单提到Html标签了,在本文中就不再赘述它的介绍了。想要再看看的可以戳Html+Css基础概要...
    年少有van阅读 4,417评论 0 14
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,692评论 1 92
  • 列表标签 无序列表 格式: 需要显示条目内容 作用:给一堆数据添加列表语义, 并且这一堆数据中所有的数据都没有先...
    MGd阅读 2,920评论 0 0

友情链接更多精彩内容