前端入门:HTML(列表和边框案例)

server/2024/9/25 21:26:41/
htmledit_views">

1.列表知识:

list-style-position有两个值,分别是inside,outside,分别表示在标签里面和在标签外面。

2.案例:

源代码:

html:

<body>

    <div class="bigBox">

        <div>在线解答问题</div>

    </div>

    <ul>

        <li>新手前端适合买什么笔记本?</li>

        <li>前端面试如何谈高薪?</li>

        <li>大厂前端招聘中的内幕</li>

        <li>28岁转前端来得及吗?</li>

        <li>女生前端好找工作吗?</li>

    </ul>

</body>

css:

* {

    padding:0;

    margin:0;

}

.bigBox {

    width: 500px;

    height: 310px;

    background-color:pink ;

    margin-top: 30px;

    margin-left: 30px;

}

.bigBox>div {

    height: 60px;

    font-size: 20px;

    color: #ff6347;

    border-top: 2px solid #4e6ef2;

    border-bottom: 1px solid #4e6ef2;

    line-height: 60px;

    font-weight: bold;

    text-indent: 1em;

}

ul {

    list-style: inside;

    font-size: 18px;

    line-height: 35px;

    margin-top: 30px;

}

ul>li:hover {

    color:blue;

    text-decoration: underline;

}


http://www.ppmy.cn/server/17405.html

相关文章

前端Vue2项目搭建过程

一.准备工作 1.可以上网找一些设计稿寻找思路开发页面界面布局 站酷设计网站&#xff1a;站酷ZCOOL-设计师互动平台-打开站酷&#xff0c;发现更好的设计&#xff01; 花瓣网&#xff1a;花瓣网 - 陪你做生活的设计师&#xff08;创意灵感天堂&#xff0c;搜索、发现设计灵感…

达芬奇调色:色彩理论入门

写在前面 整理一些达芬奇调色的笔记博文内容涉及&#xff1a; 一级调色是什么&#xff0c;以及 调色素材格式 log&#xff0c;raw&#xff0c;rec709 简单认知理解不足小伙伴帮忙指正 不必太纠结于当下&#xff0c;也不必太忧虑未来&#xff0c;当你经历过一些事情的时候&#…

linux下 Mysql8.0 离线安装

环境&#xff1a;centos7.9 MysqlL8.0.36安装包 链接&#xff1a;https://pan.baidu.com/s/1bKwHr05z8Ye82dT9tntdUA 提取码&#xff1a;3a5z 参考Centos安装MYSQL8(离线可用) 文章目录 1、解压安装2、配置启动2.1 修改配置文件2.2 mysql 启动 3、mysql 测试 1、解压安装 #…

本地生活服务平台有哪些?哪个靠谱?

随着多家互联网大厂的本地生活服务布局日益展开&#xff0c;不少人都看到了其中的巨大市场缺口和广阔前景&#xff0c;想要入驻本地生活服务平台&#xff0c;瓜分这块巨大的蛋糕。而在当下这个选择大于努力的时代&#xff0c;能否分到蛋糕以及分到多少蛋糕的关键&#xff0c;就…

平衡小车的控制算法--结合自动控制原理学习

单纯的去看自控原理&#xff0c;很多概念有点抽象&#xff0c;最好找些应用去理解相关的概念&#xff0c;就找了实验室的一个平衡小车作为应用&#xff0c;不过主要根据小车去跑matlab去验证一些控制算法。结合台湾国立交通大学林沛群的自控线上课的总结 一、自控原理重要概念 …

C语言 | Leetcode C语言题解之第49题字母异位词分组

题目&#xff1a; 题解&#xff1a; /*1.将字符串原串与副本进行绑定成一个节点2.对字符串副本进行按ascii码表进行从小到大排序3.按照字符串进行比较排序4.合并 */ typedef struct Node{char*s;char*s_vice;int len; }Node;void sortShellChar(char*s,int len){for(int dista…

Facebook自动发消息工具的编写与实践!

在数字化时代的浪潮下&#xff0c;社交媒体成为了人们生活中不可或缺的一部分&#xff0c;Facebook&#xff0c;作为全球最大的社交媒体平台之一&#xff0c;每天都有亿万用户在上面交流、分享和互动。 为了满足一些特定的需求&#xff0c;如自动发送消息、管理多个账号等&…

tsconfig.json 常用属性配置和注释

下面是一个详细的 tsconfig.json 文件示例&#xff0c;其中包含了许多常用的配置选项。这个配置适用于一个使用 TypeScript 进行前端和后端开发的通用项目。 {"compilerOptions": {"target": "es6", // 指定 ECMAScri…