常用标签

UL------无序列表

按照规范ul下只能写li
特征 每一行前面都会有一个小点
通常我们用它来写列表或者导航栏
点是默认效果
去掉默认效果就叫 样式初始化

         ` list-style-type: none;`

         ```
             <ul>
                  <li>1</li>
                  <li>2</li>
             </ul>
     
           ul{
                  list-style-type: none; 
               }
         ```

ul和li都是块标签

OL-------有序列表

每一行前面都会有一个序号
要去掉序号 则需要样式初始化

         ` ist-style-type: none;`
    
          ```
             <ol>
                   <li>a</li>
                   <li>b<li>
             </ol>
          ```

h1~h6标签 (块标签)

通常用来写大小标题
h1标签 通常一个页面只能存在一个h1标签
通常h1标签用来承载网站名或者logo
如果网站logo出现在多个地方
只给顶部的logo加上h1标签
h2标签可以有多个但是一般用来写网站 模块标题

        .<h1>这是我的标题</h1>.

p标签

p标签通常用来承载大段的文字
p标签中不能包块标签

      .<p>自闭时间城市场比赛</p>.

br标签是一个功能性标签 在哪写 哪里就换行

 .<p>上帝把v就是v就开始<br>半年之内辛苦你尽快</p>.

hr标签生成一条线

.<hr> .

img标签(单标签 行元素)

用来写图片
src=>设置图片路径
ait=>当图片加载失败时的提示信息
自带width和height属性 直接写数值 不用带单位
css的优先级高于img标签中width和height属性
本地图片

.<img src="../../1.jpeg" width="100" height="100" alt="147852" class="d1">.

云端照片

 .<img src="https://img2.baidu.com/it/u=1792249350,650626052&fm=253&fmt=auto&app=120&f=JPEG?w=1200&h=675" width="200" height="200" alt="22222">.

a标签

默认样式
1.文字默认为紫色
2.有下划线
3.鼠标移上去后变成手
功能
跳转链接
可以按照网址跳转
也可以跳转本地html文件
锚点链接

.<a href="">HOME<a>.

跳转网络连接
注意!!!
1.网址一定要写全
2.必须有协议名

.<a href="https://www.baidu.com">百度</a>.

跳转本地文件
在href中 添加本地文件路径

.<a href="./5_img.html">本地</a>.

锚点链接
在当前页面直接跳转到指定标签位置
1.目标标签必须有id
2.a标签中 href属性里面 必须写 目标标签的 id
(以id选择器的形式写id)

   . <a href="#d1">d1</a>.

target
将链接在新页面中打开

   . target="_blank".

鼠标默认变成手

.cursor: pointer;.

伪类 在css中写

也是选择器的一种
注意!!
:hover 必须在 :link 和 :visited后 定义才能生效
:active 必须在 :hover后 定义才能生效
伪类名称不区分大小写

 ...
a:link{
        /* 匹配所有没有被点击过的链接 */
        color: #000;
    }

    a:visited{
        /* 所有已经被访问过的链接 */
        color: green;
    }

    a:hover{
        /* 鼠标移入时触发 */
        color: orange;
    }

    a:active{
        /* 鼠标正在点击时 */
        color: blue;
    }
 ...
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 常用的标签其实也很简单, 平时我们百度,或者查找w3cSchool都要详细的用法, 这里只是简单的列举几个 注意:...
    你的胡霸霸阅读 3,240评论 0 1
  • 02.HTML常用标签 一.HTML 语法规范 1.1 基本语法概述 HTML 标签是由尖括号包围的关键词,例如 ...
    Jason杰森阅读 3,355评论 0 0
  • 根元素 HTML 属性 元素包含 全局属性。 示例 <!DOCTYPE html> ... ... 注意事项 ...
    VinceWen阅读 3,690评论 0 0
  • 记录一下头脑中的常用标签 接触HTML,CSS以来常用的标签。 <div> 块级元素,创建一个区域,一般用来对元素...
    bzwhlll阅读 1,254评论 0 0
  • 1.DOCTYPE 用来选择文档类型 <!DOCTYPE html> //用于html5 2.HTML 元素 ...
    奈_4f97阅读 3,532评论 0 0