资讯专栏INFORMATION COLUMN

【代码笔记】Web-CSS-CSS Display

王伟廷 / 2896人阅读

一,效果图。

二,代码。

DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>CSS Display(显示)title>
    <style>
    h1.hidden {
        display: none;
    }
    
    li {
        display: inline;
    }
    
    span {
        display: block;
    }
    style>
head>

<body>
    <h1>this is a visible headingh1>
    <h1 class="hidden">this is a hidden headingh1>
    <p>notice that the hidden heading still takes up space.p>
    <ul>
        <li><a href="/html" target="_blank">HTMLa>li>
        <li><a href="/css/" target="_blank">CSSa>li>
        <li><a href="/js/" target="_blank">JavaScripta>li>
        <li><a href="/xml/" target="_blank">XMLa>li>
    ul>
    <h2>nirvanah2>
    <span>Record: MTV Unplugged in New Yorkspan>
    <span>Year: 1993span>
    <h2>Radioheadh2>
    <span>Record: OK Computerspan>
    <span>Year: 1997span>
body>

html>

 

参考资料:《菜鸟教程》

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/1247.html

相关文章

  • 代码笔记Web-CSS-CSS 教程

    一,效果图。 二,代码。 DOCTYPE html> CSS 教程 body { background-color: #d0e4fe; } h1 { color: range; text-align: center; } p { fon...

    endless_road 评论0 收藏0
  • 代码笔记Web-CSS-CSS 语法

    一,效果图。 二,代码。 DOCTYPE html> CSS 语法 p { color: red; text-align: center; } Hello world! this paragraph is styled with css   参考资料:《菜鸟教程》

    zhangwang 评论0 收藏0
  • 代码笔记Web-CSS-CSS id和Class选择器

    一,效果图。 二,代码。 DOCTYPE html> CSS id和class选择器 #para1 { text-align: center; color: red; } .center { text-align: center; } p.center...

    Pluser 评论0 收藏0
  • 代码笔记Web-CSS-CSS background背景

    摘要:实例改文本插入在元素中该段落有自己的背景颜色背景图片不重复,设置实例背景图片只显示一次,并与文本分开实例中还添加了属性用于让图片与文本间隔开参考资料菜鸟教程一,效果图。 二,代码。 DOCTYPE html> CSS backgrounds h1 { background-color: #6495ed; } ...

    番茄西红柿 评论0 收藏0
  • 代码笔记Web-CSS-CSS Text(文本)

    摘要:文本加上上划线全变成大写文本的第一行缩进加上下划线全变成小写加上下划线首字母大写去掉链接的下划线参考资料菜鸟教程一,效果图。   二,代码。     DOCTYPE html> CSS Test(文本) body { color: red } h1 { color: #00ff00; ...

    tain335 评论0 收藏0

发表评论

0条评论

王伟廷

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<