二阶段day1

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>

    <!--2.段落标签: p


        网页的内容中一个段落文字对应一个p标签
        p标签的内容结束后会自动换行
        
        注意：html中的文字是不会因为手动的回车和空格以及缩进产生空白效果(换行、空格、缩进无效)
             但是可以通过一些特殊的符号，来产生特定的效果
             
        空格符：&nbsp;
        强制换行:<br />
    -->
    <p>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;随着今年苹果秋季发布会的闭幕，从 1（初代 iPhone）到 10（iPhone X），<br />
        新 iPhone 的命名即将用尽包括数字 10 以内的所有数字，<br />
        对于苹果来说，从明年开始，为新 iPhone 命名将会是一件头疼的事情。2&divide;10=0.2
    </p>
    <p>
        实际上，去年苹果公司决定用罗马数字 X（读 ten）来命名开始，iPhone 已经步向了「命名荒」，
        而进一步加剧这个情况的，则是今年的新 iPhone，由于新 iPhone 并没有巨大的变化，
        所以它似乎并不足以获得一个全新的命名，比如说 iPhone Ⅺ （11）这样的称呼。
    </p>
    
    <!--3.文字效果:
        a.加粗：b标签，strong标签
        b标签：单纯的在样式上进行加粗
        strong标签：除了将文字加粗显示外还有强调的意义
        
        b.倾斜：i标签,em标签
        em标签有强调的作用
    -->
    <p>实际上，去年<i>苹果公司</i>决定用罗马数字 X（读 ten）来命名开始，<em>iPhone</em> 已经步向了「<b>命名荒</b>」，
        而进一步加剧这个情况的，则是今年的新 iPhone，由于新 iPhone 并没有<strong><em>巨大</em></strong>的变化，
        所以它似乎并不足以获得一个全新的命名，比如说 <strong>iPhone Ⅺ</strong> （11）这样的称呼。</p>
        
    <!--4.水平线：hr
        单标签
    -->
    <hr />
    
    <!--5.列表标签:ul,ol,dl
        
        ul:无序列表
        ol:有序列表
        dl:自定义列表
    -->
    <ul>
        <li>语文</li>
        <p>语文是个什么样的学科。。。。</p>
        <li>数学</li>
        <li>英语</li>         
    </ul>
    <ol>
        <li>北京</li>
        <p>北京最大的特点是雾霾~</p>
        <li>成都</li>
        <p>天府之国</p>
        <li>大连</li>
        <p>美丽的海滨城市</p>
        <li>重庆</li>
        <p>辣妹儿+火锅</p>
        <li>青岛</li>
    </ol>
    <dl>
        <!--dt对列表进行分组-->
        <dt>A</dt>
        <!--dd列举分组下的内容-->
        <dd>and</dd>
        <dd>are</dd>
        
        <dt>B</dt>
        <dd>big</dd>
        <dd>bpdy</dd>
    </dl>
    
    
</body>

</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>图片和超链接</title>
</head>
<body>

        src属性：图片地址（可以是本地图片地址，也可以是远程服务器上的图片地址）
        title属性：设置图片的标题(这个标题是鼠标停留在图片上等一会儿出现的文字)
        alt属性：用来设置图片加载失败的时候出现的提示信息
    -->
    <img id="1" src="img/luffy4.jpg" title="路飞和艾斯" alt="加载失败"/>
    <img id="2" title="宝儿姐" src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1537175265043&di=4c1b0dd59ce4130e292cae87e40d147b&imgtype=0&src=http%3A%2F%2Fuploads.5068.com%2Fallimg%2F171215%2F74-1G215200215.jpg"/>
    <img id="3" src="img/luffy4.jpg" title="路飞和艾斯" alt="加载失败"/>
    <img title="宝儿姐" src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1537175265043&di=4c1b0dd59ce4130e292cae87e40d147b&imgtype=0&src=http%3A%2F%2Fuploads.5068.com%2Fallimg%2F171215%2F74-1G215200215.jpg"/>
    <img src="img/luffy4.jpg" title="路飞和艾斯" alt="加载失败"/>
    <img title="宝儿姐" src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1537175265043&di=4c1b0dd59ce4130e292cae87e40d147b&imgtype=0&src=http%3A%2F%2Fuploads.5068.com%2Fallimg%2F171215%2F74-1G215200215.jpg"/>
    <img src="img/luffy4.jpg" title="路飞和艾斯" alt="加载失败"/>
    <img title="宝儿姐" src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1537175265043&di=4c1b0dd59ce4130e292cae87e40d147b&imgtype=0&src=http%3A%2F%2Fuploads.5068.com%2Fallimg%2F171215%2F74-1G215200215.jpg"/>
    <img src="img/luffy4.jpg" title="路飞和艾斯" alt="加载失败"/>
    <img title="宝儿姐" src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1537175265043&di=4c1b0dd59ce4130e292cae87e40d147b&imgtype=0&src=http%3A%2F%2Fuploads.5068.com%2Fallimg%2F171215%2F74-1G215200215.jpg"/>
    <img src="img/luffy4.jpg" title="路飞和艾斯" alt="加载失败"/>
    <img title="宝儿姐" src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1537175265043&di=4c1b0dd59ce4130e292cae87e40d147b&imgtype=0&src=http%3A%2F%2Fuploads.5068.com%2Fallimg%2F171215%2F74-1G215200215.jpg"/>
    
    <!--2.超链接标签:a标签
        想要点击跳转的地方都可以使用超链接语法
        注意：a标签的内容部分是可见的，是可以被点击
        
        (1)href属性：跳转目标对应的地址
        a.其他的网页地址  -----  跳转
        b.写本地的一个html路径 ------ 跳转
        c.空  ------- 刷新当前网页(重新加载)
        d.选择器  ------ 让网页跳转到指定的位置
        
        (2)target属性：设置跳转方式
        _self(默认值):在当前页中刷新出新的内容
        _blank:创建一个新的页面，在新的页面中刷新出href指定的内容
        注意：刷新当前网页和在当前网页中跳转到指定位置的时候，只能使用默认的_self
    -->
    <a target="_blank" href="http://www.baidu.com">百度一下</a>
    <a href="http://www.1000phone.com">千锋</a>
    <a href="01-文本标签.html">文本标签</a>
    <a href="">刷新</a>
    <a href="#1">第一张</a>
    <a href="#2">第二张</a>
    <a href="#3">第三张</a>
</body>

</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>表格标签</title>
</head>
<body>

        2.属性
        a.border属性: 设置表格的边框的宽度（只能作用于table）
        b.bordercolor:设置边框颜色 （只能作用于table）
        c.background:设置背景图片
        d.bgcolor:设置背景颜色(可以作用于table\tr\td)
        e.cellspacing:设置单元格与单元格之间的间距（默认是1）
        f.cellpadding:设置内容和单元格之间的间距
        g.width: 一般作用于某一个单元格，影响的是这个单元格对应的那一列
        h.height: 一般作用于行，影响的是一行的高度
        i.align：设置对齐方式(可以作用于table\tr\td)
        作用于table，让整个表格在浏览器中居中
        作用于tr/td，让内容在单元格中居中
    -->
    <table border="1" bordercolor="red" bgcolor="beige" cellspacing="0" align="center">
        <!--<tr><th>成绩表</th></tr>-->
        
        <!--第一行-->
        <tr bgcolor='coral' height="50" align="center">
            <!--第一行的第一个单元格-->
            <td width="100">姓名</td>
            <td width="60">成绩</td>
            <td width="140">是否留级</td>
        </tr>
        
        <!--第二行-->
        <tr height="140">
            <td bgcolor="cornflowerblue" align="center">张三</td>
            <!--第二行的第二个单元格-->
            <td>90</td>
            <td>否</td>
        </tr>
        
        <!--第三行-->
        <tr height="80">
            <td>李四</td>
            <td>80</td>
            <!--第三行的第三个单元格-->
            <td>否</td>
        </tr>
    </table>
    
    <!--table>tr*3>td*4: 创建一个3行X4列的表格-->
    
    
</body>

</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>细线表格</title>
</head>
<body>
<p>XXX信息表</p>
<table cellspacing="1" bgcolor="purple">
<tr bgcolor="white" height="80" align="center">
<td width="120">姓名</td>
<td width="250">毕业院校</td>
</tr>
<tr bgcolor="white" height="100">
<td>余婷</td>
<td>

<img src="img/luffy4.jpg"/>
<a href="http://www.tsinghua.edu.cn/publish/thu2018/index.html">清华大学</a>
</td>
</tr>
<tr bgcolor="white" height="100">
<td></td>
<td></td>
</tr>
<tr bgcolor="white" height="100">
<td></td>
<td></td>
</tr>
<tr bgcolor="white" height="100">
<td></td>
<td></td>
</tr>
</table>

</body>

</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>

</head>
<body>

        过程：先确定表格中最多多少行，然后再数每一行有多少个单元格。
             再确定每个单元格是否有合并现象，如果单元格有行的合并就设置单元格的rowspan属性，
             如果有列的合并就设置单元格的colspan的值。
    -->
    
    <table bgcolor="black" cellspacing="1" width="600" height="500">
        <tr bgcolor="white">
            <td></td>
            <td></td>
            <td colspan="2"></td>
            <td></td>
        </tr>
        <tr bgcolor="white">
            <td></td>
            <td></td>
            <td rowspan="2"></td>
            <td rowspan="2"></td>
            <td rowspan="2"></td>
        </tr>
        <tr bgcolor="white">
            <td></td>
            <td></td>
        </tr>
        <tr bgcolor="white">
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
        </tr>
        <tr bgcolor="white">
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
        </tr>
        <tr bgcolor="white">
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
        </tr>
    </table>
    
</body>

</html>

客户端来卡号的看法熬枯受淡放开手
fasjfkashkjsfakhf
sakdfhaj
ks 阿斯蒂芬哈萨克交话费

百度一下

常用标签

1.HTML<head>元素

<head> 元素包含了所有的头部标签元素。在 <head>元素中你可以插入脚本（scripts）, 样式文件（CSS），及各种meta信息。
可以添加在头部区域的元素标签为: <title>, <style>, <meta>, <link>, <script>, <noscript>, and <base>.

标签	描述
<title>	定义了文档的标题
<base>	定义了页面链接标签的默认链接地址
<link>	定义了一个文档和外部资源之间的关系
<meta>	定义了HTML文档中的元数据
<script>	定义了客户端的脚本文件
<style>	定义了HTML文档的样式文件

< meta>元素

meta标签主要是通过属性为网页提供元数据主要包括：name属性和http-equiv属性

<mate name=“参数”, content=“具体描述”>

name属性参数:

1.keywords(关键字)
说明：用于告诉搜索引擎，你网页的关键字。举例：

<meta name="keywords" content="python,技术，理科生，前端">

2.description(网站内容的描述)
说明：用于告诉搜索引擎，你网站的主要内容。举例：

<meta name="description" content="关于python的技术博客">

3.author(作者)
说明：用于标注网页作者举例：

<meta name="author" content="726550822@qq.com">

4.viewport(移动端的窗口)
说明：这个属性常用于设计移动端网页。在用bootstrap,AmazeUI等框架时候都有用过viewport。

<meta name="viewport" content="width=device-width, initial-scale=1">

5.robots(定义搜索引擎爬虫的索引方式)
说明：robots用来告诉爬虫哪些页面需要索引，哪些页面不需要索引。content的参数有all,none,index,noindex,follow,nofollow。默认是all。
举例：

<meta name="robots" content="none">

具体参数如下：
a.none : 搜索引擎将忽略此网页，等价于noindex，nofollow。
b.noindex : 搜索引擎不索引此网页。
c.nofollow: 搜索引擎不继续通过此网页的链接索引搜索其它的网页。
d.all : 搜索引擎将索引此网页与继续通过此网页的链接索引，等价于index，follow。
e.index : 搜索引擎索引此网页。
f.follow : 搜索引擎继续通过此网页的链接索引搜索其它的网页。

6.renderer(双核浏览器渲染方式)
说明：renderer是为双核浏览器准备的，用于指定双核浏览器默认以何种方式渲染页面。比如说360浏览器。举例：

<meta name="renderer" content="webkit"> //默认webkit内核
<meta name="renderer" content="ie-comp"> //默认IE兼容模式
<meta name="renderer" content="ie-stand"> //默认IE标准模式

http-equiv属性

百度一下

a	b
abc	bca

a	b
abc	bca

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<!DOCTYPE html>

<html>

<head>
<meta charset="utf-8" />
<title>学习HTML</title>
</head>

<!--
    body标签中的内容是在网页中可见的部分
    html学习目标就是掌握body中的常用标签
-->
<body>
    今天开始学习web前端
</body>

</html>

人面猴
序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
沈念sama阅读 203,456评论 5赞 477
死咒
序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
沈念sama阅读 85,370评论 2赞 381
救了他两次的神仙让他今天三更去死
文/潘晓璐我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
开封第一讲书人阅读 150,337评论 0赞 337
道士缉凶录：失踪的卖姜人
文/不坏的土叔我叫张陵，是天一观的道长。经常有香客问我，道长，这世上最难降的妖魔是什么？我笑而不...
开封第一讲书人阅读 54,583评论 1赞 273
港岛之恋（遗憾婚礼）
正文为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
茶点故事阅读 63,596评论 5赞 365
恶毒庶女顶嫁案：这布局不是一般人想出来的
文/花漫我一把揭开白布。她就那样静静地躺着，像睡着了一般。火红的嫁衣衬着肌肤如雪。梳的纹丝不乱的头发上，一...
开封第一讲书人阅读 48,572评论 1赞 281
城市分裂传说
那天，我揣着相机与录音，去河边找鬼。笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。我是一名探鬼主播，决...
沈念sama阅读 37,936评论 3赞 395
双鸳鸯连环套：你想象不到人心有多黑
文/苍兰香墨我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
开封第一讲书人阅读 36,595评论 0赞 258
万荣杀人案实录
序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
沈念sama阅读 40,850评论 1赞 297
护林员之死
正文独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋以下内容为张勋视角年9月15日...
茶点故事阅读 35,601评论 2赞 321
白月光启示录
正文我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
茶点故事阅读 37,685评论 1赞 329
活死人
序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
沈念sama阅读 33,371评论 4赞 318
日本核电站爆炸内幕
正文年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
茶点故事阅读 38,951评论 3赞 307
男人毒药：我在死后第九天来索命
文/蒙蒙一、第九天我趴在偏房一处隐蔽的房顶上张望。院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
开封第一讲书人阅读 29,934评论 0赞 19
一桩弑父案，背后竟有这般阴谋
文/苍兰香墨我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。一阵脚步声响...
开封第一讲书人阅读 31,167评论 1赞 259
情欲美人皮
我被黑心中介骗来泰国打工，没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。一个月前我还...
沈念sama阅读 43,636评论 2赞 349
代替公主和亲
正文我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
茶点故事阅读 42,411评论 2赞 342

二阶段day1

常用标签

1.HTML<head>元素

< meta>元素

推荐阅读更多精彩内容