Propriedades da lista do CSS

English | French | Portugese | Dutch | Italian

em linha

|

C�digos de fonte

|

|

|

|

HTML Tutorials

TCP/IP Tutorial

XML Tutorials

Schema Tutorial

XForms Tutorial

XSL-FO Tutorial

XML DOM Tutorial

XQuery Tutorial

XPointer Tutorial

Web Services Tutorial

Browser Scripting

JavaScript Tutorial

VBScript Tutorial

HTML DOM Tutorial

WMLScript Tutorial

Server Scripting

PL/SQL Tutorial

.NET (dotnet)

Multimedia

Photoshop Tutorial

Gnuplot Programming

GIF Animation Tutorial

Scientific Visualization Tutorial

Web Building

Weblogic Tutorial

Web Site Hosting

Java Tutorials

Servlets Tutorial

Struts Tutorial

Programming Langauges

Visual Basic Tutorial

Data Structures Using C

Assembly Language

Forth Programming

Lisp Programming

Data Warehousing

CGI Programming

Soft Skills

Communication Skills

Time Management

Project Management

Leadership Skills

Corporate Communication

Negotiation Skills

Database Tutorials

Operating System

IP-Masquerading

Software Testing

SAP Module

Business Warehousing

Material Management

Sales & Distribution

Customer Relationship Management

Production and Planning

Networking Programming

Networking Tutorial

Microsoft Office

Microsoft Outlook

Microsoft PowerPoint

Microsoft Publisher

Microsoft Excel

Microsoft Front Page

Microsoft InfoPath

Microsoft Access

Accounting

Financial Accounting

Managerial Accounting

Propriedades da lista do CSS

Previous

Next

H� dois tipos das listas CSS:

unordered e

requisitado.

Entretanto, em compara��o ao HTML, o CSS permite uns customizations mais adicionais das listas, com a permiss�o para que as imagens sejam usadas como as balas no listas unordered.

Tipo do estilo da lista do CSS

Tudo que voc� tem que fazer � escolher um estilo diferente para suas listas, se o numbering do defeito de listas requisitadas, ou as balas/discos de listas unordered, ent�o, se voc� estiver querendo usar algo diferente. O CSS permite que voc� selecione de uma variedade larga de formas diferentes do artigo da lista.

Estilos Unordered da lista: quadrado, c�rculo, disco (defeito), e nenhuns
Estilos requisitados da lista: superior-alfa, baixo-alfa, superior-roman, baixo-roman, decimal (defeito), e nenhuns

C�digo do CSS

ol { list-style-type: upper-roman; }
ul { list-style-type: circle; }

Listas do CSS com imagens

Como n�s indicamos na introdu��o, voc� para introduzir uma imagem no lugar das balas normais, lista do CSS usada.

Uma escolha boa para uma imagem da bala uma que � gr�fico relativamente simples/liso e � menor do que a altura de seu texto.

C�digo do CSS

ul { list-style-image: url("listArrow.gif"); }
ol { list-style-image: url("listArrow2.gif"); }

Posi��o da lista do CSS

� poss�vel alterar o recorte que ocorre com seus artigos da lista usando o CSS.

Ver o exemplo abaixo para o truque de recortar suas listas. Ao especificar o recorte, voc� pode somente usar keyterms.

ul { list-style-position: inside; }
ol { list-style-position: outside; }

Os marcadores diferentes do lista-artigo em listas unordered

C�digo do CSS

<html>
<head>
<style type="text/css">
ul.disc {list-style-type: disc}
ul.circle {list-style-type: circle}
ul.square {list-style-type: square}
ul.none {list-style-type: none}
</style>
</head>

<body>
<ul class="disc">
<li>Coffee</li>
<li>Tea</li>
<li>Coca Cola</li>
</ul>

<ul class="circle">
<li>Coffee</li>
<li>Tea</li>
<li>Coca Cola</li>
</ul>

<ul class="square">
<li>Coffee</li>
<li>Tea</li>
<li>Coca Cola</li>
</ul>

<ul class="none">
<li>Coffee</li>
<li>Tea</li>
<li>Coca Cola</li>
</ul>
</body>

</html>

A tabela follwing descreve as propriedades da lista:

Property	Description	values
list-style	A shorthand property for setting all of the properties for a list in one declaration	list-style-type list-style-position list-style-image
list-style-image	Sets an image as the list-item marker	none url
list-style-position	Sets where the list-item marker is placed in the list	inside outside
list-style-type	Sets the type of the list-item marker	none disc circle square decimal decimal-leading-zero lower-roman upper-roman lower-alpha upper-alpha lower-greek lower-latin upper-latin hebrew armenian georgian cjk-ideographic hiragana katakana hiragana-iroha katakana-iroha
marker-offset		auto length

Previous

Next

Keywords: css list style, css list padding, css tutorials, cascading style sheets

HTML Quizes

XML Quizes

Web Services Quiz

Browser Scripting Quizes

JavaScript Quiz

Server Scripting Quizes

Apple Script Quiz

SQL Server Quiz

.NET (dotnet) Quizes

Microsoft.Net Quiz

.Net Mobile Quiz

C# : C Sharp Quiz

Multimedia Quizes

Gnuplot Programming Quiz

GIF Animation Quiz

Scientific Visualization Quiz

Web Building Quizes

Web Browsers Quiz

Web Hosting Quiz

Web Building Quiz

Web Quality Quiz

Web Semantic Quiz

Web Careers Quiz

Web Site Hosting Quiz

Domain Name Quiz

Java Quizes

Programming Langauges Quizes

Visual Basic Quiz

Data Structures Using C Quiz

Assembly Language Quiz

Forth Programming Quiz

Lisp Programming Quiz

Data Warehousing Quiz

CGI Programming Quiz

Soft Skills Quizes

Communication Skills Quiz

Time Management Quiz

Project Management Quiz

Leadership Skills Quiz

Corporate Communication Quiz

Negotiation Skills Quiz

Database Quizes

Operating System Quizes

IP-Masquerading Quiz

Software Testing Quizes

SAP Module Quizes

Business Warehousing Quiz

Material Management Quiz

Sales & Distribution Quiz

Human Resource Quiz

Customer Relationship Management Quiz

Production and Planning Quiz

Networking Programming Quizes

Networking Quiz

Microsoft Office Quizes

Microsoft Word Quiz

Microsoft Outlook Quiz

Microsoft PowerPoint Quiz

Microsoft Publisher Quiz

Microsoft Excel Quiz

Microsoft Front Page Quiz

Microsoft InfoPath Quiz

Microsoft Access Quiz

Accounting Quizes

Financial Accounting Quiz

Managerial Accounting Quiz

Copyright � 2003-2024 Vyom Technosoft Pvt. Ltd., All Rights Reserved.