ul, li, a怎么用

article/2025/9/18 13:45:01 
<style type="text/css">
*{margin:0; padding:0;font-size:14px}
body{padding-top:20px}
ul,li{list-style: none}
ul{background: yellow;}
li{float:left; width:60px; height:50px;}//width:60px后加,不然ie li会比a宽
a{display:inline-block;padding:0 30px;line-height: 50px;background:pink url(images/dian.jpg) no-repeat left center; width:60px;margin-left:30px;white-space:nowrap;overflow: hidden;}/*外部div未设置高度, 清楚其内部div浮动产生脱离文档流*/
.clearfix:after {visibility: hidden;    display: block;font-size: 0;content: ".";clear: both;height: 0;
}
/*因为ie6、7不能识别伪类, 而只需要用zoom:1既能触发布局*/
* html .clearfix             {zoom: 1;} /*IE6*/
*:first-child+html .clearfix {zoom: 1;} /*IE7*/
</style>
</head><body><ul class="clearfix"><li><a href="###">aaaaaaaaaaaaaaaaaaaaaaaa</a></li><li><a href="###">b</a></li><li><a href="###">ccc中中中</a></li></ul>
</body>

 

　　下面所有浏览器指的是谷歌、火狐、ie6、7、8

转载于:https://www.cnblogs.com/iz100/archive/2013/01/18/2865909.html


http://chatgpt.dhexx.cn/article/nlXKjxjr.shtml

相关文章

html用ul li制作导航条

html用ul li制作导航条

制作的导航条如图所示&#xff1a; 当鼠标滑过每个导航的时候&#xff0c;背景会变换颜色。技术点&#xff1a;将超链接a标签&#xff0c;转换成block标签&#xff0c;从而设置鼠标滑过时的背景色。代码如下所示&#xff1a; <html ><head><meta charset"…
阅读更多...
HTML中的列表ol ul

HTML中的列表ol ul

<!DOCTYPE html> <html lang"en"> <head><title>列表</title> </head> <body><h3 style"background-color: rgb(102, 165, 165);">畅销图书榜</h3><hr/><!-- 有序列表 ol --><ol>…
阅读更多...
ul及ol标签list-style-type介绍

ul及ol标签list-style-type介绍

ul及ol标签list-style-type介绍 1.ul/ol标签样式介绍 a.不设置ul中标签类型&#xff08;默认&#xff09;&#xff1a; 不设置ol中标签类型&#xff08;默认&#xff09;&#xff1a; b.设置方法代码&#xff1a; 在html中设置或者在CSS样式中设置 <style>#kl{list-s…
阅读更多...
ul li 实例

ul li 实例

之前使用过很多次的 ul li&#xff0c;不过都怎么规范&#xff0c;今天学习到一个整合“p、span、a”等标签的ul li实例&#xff0c;防止忘记&#xff0c;记录一下。 html代码 <span style"white-space:pre"> </span><li><h2>发明专利</h…
阅读更多...
html中列表标签ul、ol、 dl的使用和介绍

html中列表标签ul、ol、 dl的使用和介绍

一、UL列表介绍 ul 是无需列表&#xff0c;li列表里面的一条值&#xff0c;例如 <ul><li>中国</li><li>四川</li><li>成都</li></ul> 效果如下&#xff1a; 可以改变前面li的样式&#xff0c;通过给ul添加样式&#xff0c;其…
阅读更多...
ul好看的li列表样式

ul好看的li列表样式

以下是实际效果截图&#xff1a; 示例代码如下&#xff1a; <!DOCTYPE html> <html> <head> <style> .other-item-title{margin:10px 20px;padding:5px;line-height:30px;font-weight:400;border-bottom:1px solid #e8e9e7;color:#383937;position:re…
阅读更多...
ul和ol的区别以及经验总结

ul和ol的区别以及经验总结

一.ul是无序列表 网页中最为常见的列表&#xff0c;各个列表项之间为并列关系&#xff0c;没有顺序级别之分&#xff0c;如导航栏&#xff0c;新闻话题展示区等。 默认示例表现为&#xff08;默认带有实心圆&#xff09;&#xff1a; <ul><li>无序列表项1</li&g…
阅读更多...
ul元素的使用

ul元素的使用

为了使网页更易读、排序有序、条理清晰&#xff0c;所以我们要学会ul元素——无序列表 效果图&#xff1a; 代码如下&#xff1a; <!DOCTYPE html> <html> <head><meta charset"UTF-8"><title>元素的使用</title> </head&g…
阅读更多...
为什么我们需要带上类型后缀？U/UL/ULL/L/LL

为什么我们需要带上类型后缀？U/UL/ULL/L/LL

类型后缀 给变量赋值的时候分两个阶段。 第一步&#xff0c;如果没有指定字面量的类型&#xff0c;C99会找到一个能容纳字面量值的最小的带符号类型&#xff08;int / long int / long long int&#xff09;。 第二步&#xff0c;转换成左边变量类型并赋值。 long i 0xffff;…
阅读更多...
IMX6ULL与IMX6UL异同（主要是优化了其成本：安全功能减低，优化功耗EMC SIM模块删除等与但和I.MX6UltraLite芯片是PIN-2-PIN兼容的）

IMX6ULL与IMX6UL异同（主要是优化了其成本：安全功能减低，优化功耗EMC SIM模块删除等与但和I.MX6UltraLite芯片是PIN-2-PIN兼容的）

I.MX6ULL相对于I.MX6UltraLite来说&#xff0c;主要是优化了其成本。与I.MX6UltraLite芯片是PIN-2-PIN兼容的&#xff0c;使的I.MX6ULL很容易在IMX6UL上重用&#xff0c;主要更改如下。 1. 增加了EPD显示支持与EPDC/PXP的低端电子阅读器&#xff0c;相对于6sl7d系列也是一个低…
阅读更多...
论文阅读笔记（1）——《Ultra-Low Latency (ULL) Networks: The IEEE TSN and IETF DetNet Standards and Related 5G》

论文阅读笔记（1）——《Ultra-Low Latency (ULL) Networks: The IEEE TSN and IETF DetNet Standards and Related 5G》

《超低延迟 (ULL) 网络&#xff1a;IEEE TSN 和 IETF DetNet 标准及相关 5G ULL 研究》 DOI&#xff1a;10.1109/COMST.2018.2869350 前言 IEEE 802.1 时间敏感网络 (TSN) 标准和相关研究旨在为 ULL 网络提供链路层支持&#xff0c;而新兴的 IETF 确定性网络 (DetNet) 标准则…
阅读更多...
机器学习十大算法简介

机器学习十大算法简介

本文对机器学习的常用算法进行常识性的认识&#xff0c;介绍这些算法是什么以及如何应用&#xff08;主要是针对分类问题&#xff09;以及对单个算法的理解的简介。本文要介绍的十大算法如下&#xff1a;①决策树&#xff1b;②随机森林&#xff1b;③逻辑回归&#xff1b;④SV…
阅读更多...
常见的机器学习算法与人工神经网络

常见的机器学习算法与人工神经网络

目录 1. 邻近算法K-NearesNeighbor (KNN) 1.1 KNN算法核心思想 1.2 KNN算法步骤 1.3 KNN预测分类 2. 图神经网络Graph Neural Networks (GNN) 2.1图的基本定义 2.2 图神经网络模型 3. 卷积神经网络Convolutional Neural Network (CNN) 3.1 CNN的结构 3.2 卷积 3.3 卷…
阅读更多...
【KELM预测】基于粒子群算法改进核极限学习机(KELM)分类算法 matlab源码

【KELM预测】基于粒子群算法改进核极限学习机(KELM)分类算法 matlab源码

一、核极限学习机 本文将介绍一种新的SLFN的算法&#xff0c;极限学习机&#xff0c;该算法将随机产生输入层和隐含层间的连接权值和隐含层神经元的阈值&#xff0c;且在训练过程中无需调整&#xff0c;只需要设置隐含层的神经元的个数&#xff0c;便可以获得唯一最优解&#x…
阅读更多...
机器学习算法[9]--集成方法之XGBoost原理详解及XGBoost库实现

机器学习算法[9]--集成方法之XGBoost原理详解及XGBoost库实现

机器学习 1. XGBoost1.1 原理1.1.1 算法解析1.1.2 算法流程 1.2 XGBoost库实现 1. XGBoost 1.1 原理 XGBoost(Extreme Gradient Boosting)通过串行的方式迭代训练多个相互依赖的决策树回归模型&#xff0c;最后综合多个简单模型共同作用产生输出&#xff0c;在GBDT作出全面优…
阅读更多...
基于PSO优化的SVM数据预测算法matlab仿真

基于PSO优化的SVM数据预测算法matlab仿真

目录 1.算法仿真效果 2.算法涉及理论知识概要 3.MATLAB核心程序 4.完整MATLAB 1.算法仿真效果 matlab2022a仿真结果如下&#xff1a; 2.算法涉及理论知识概要 支持向量机&#xff08;support vector machines, SVM&#xff09;是二分类算法&#xff0c;所谓二分类即把具有…
阅读更多...
基于改进大洪水算法求解TSP问题

基于改进大洪水算法求解TSP问题

from function import get_distances, get_value, result_plot, get_neighbors from random import randintdef r_opt(route):"""利用2-opt算法对route进行改进,对当前路径所有不相邻的两点进行边边交换"""new_route route[:]value get_value(…
阅读更多...
粒子群算法介绍

粒子群算法介绍

优化算法——粒子群优化介绍 1. 基本概念 粒子群优化算法(PSO&#xff1a;Particle swarm optimization) 是一种进化计算技术&#xff08;evolutionary computation&#xff09;。源于对鸟群捕食的行为研究。粒子群优化算法的基本思想&#xff1a;是通过群体中个体之间的协作…
阅读更多...
Python实现VRP常见求解算法——离散量子行为粒子群算法（DQPSO）

Python实现VRP常见求解算法——离散量子行为粒子群算法（DQPSO）

基于python语言&#xff0c;实现经典离散量子行为粒子群算法&#xff08;DQPSO&#xff09;对车辆路径规划问题&#xff08;CVRP&#xff09;进行求解。 目录 优质资源1. 适用场景2. 求解效果3. 问题分析4. 数据格式5. 分步实现6. 完整代码参考 优质资源 python实现6种智能算法…
阅读更多...
回归预测 | MATLAB实现基于QPSO-BiLSTM、PSO-BiLSTM、BiLSTM多输入单输出回归预测

回归预测 | MATLAB实现基于QPSO-BiLSTM、PSO-BiLSTM、BiLSTM多输入单输出回归预测

回归预测 | MATLAB实现基于QPSO-BiLSTM、PSO-BiLSTM、BiLSTM多输入单输出回归预测 目录 回归预测 | MATLAB实现基于QPSO-BiLSTM、PSO-BiLSTM、BiLSTM多输入单输出回归预测效果一览基本描述程序设计参考资料 效果一览 基本描述 1.Matlab实现QPSO-BiLSTM、PSO-BiLSTM、BiLSTM神经…
阅读更多...
推荐文章

Copyright @ 2022~2023