Semantic UI React  2.0.4
GitHub CHANGELOG
Getting Started
IntroductionGet StartedCompositionShorthand PropsThemingLayout examplesPrototypesMigration guide to v2
Elements
ButtonContainerDividerFlagHeaderIconImageInputLabelListLoaderPlaceholderRailRevealSegmentStep
Collections
BreadcrumbFormGridMenuMessageTable
Views
AdvertisementCardCommentFeedItemStatistic
Modules
AccordionCheckboxDimmerDropdownEmbedModalPopupProgressRatingSearchSidebarStickyTabTransition
Behaviors
Visibility
Addons
ConfirmPaginationPortalRadioRefSelectText AreaTransitionable Portal

List
A list groups related content.

src/elements/List/List.js
Semantic UI List Docs
ListList.ContentList.DescriptionList.HeaderList.IconList.ItemList.List

Types

List

A list groups related content

Try itCodeSandboxMaximizePermalink
Apples
Pears
Oranges

You can do the same using shorthands.

Try itCodeSandboxMaximizePermalink
Apples
Pears
Oranges

A list item can contain an icon

Try itCodeSandboxMaximizePermalink
Semantic UI
New York, NY
jack@semantic-ui.com
semantic-ui.com

You can do the same using shorthands.

Try itCodeSandboxMaximizePermalink
Semantic UI
New York, NY
jack@semantic-ui.com
semantic-ui.com
Try itCodeSandboxMaximizePermalink
src
Source files for project
site
Your site's theme
themes
Packaged theme files
default
Default packaged theme
my_theme
Packaged themes are also available in this folder
theme.config
Config file for setting packaged themes
dist
Compiled CSS and JS files
components
Individual component CSS and JS
semantic.json
Contains build settings for gulp

Bulleted

A list can mark items with a bullet

Try itCodeSandboxMaximizePermalink
Gaining Access
Inviting Friends
Benefits
Link to somewhere
Rebates
Discounts
Warranty

You can also use an `ul` and `li` to render a bulleted list

Try itCodeSandboxMaximizePermalink

You can also use an `ol` and `li` to render an ordered list

Try itCodeSandboxMaximizePermalink
  1. Signing Up
  2. User Benefits
  3. User Types
    1. Admin
    2. Power User
    3. Regular User
  4. Deleting Your Account
Try itCodeSandboxMaximizePermalink
You can also manually specify a value for an ordered list using value.
  1. Signing Up
  2. User Benefits
  3. User Types
    1. Admin
    2. Power User
    3. Regular User
  4. Deleting Your Account

Content

Item

A list item can contain a set of items

Icon

A list item can contain an icon

Image

A list can contain an image

A list can contain links

A list can contain a header

Description

A list can contain a description

Variations

Horizontal

A list can be formatted to have items appear horizontally

Inverted

A list can be inverted to appear on a dark background

Selection

A selection list formats list items as possible choices

Animated

A list can animate to set the current item apart from the list

Be sure content can fit on one line, otherwise text content will reflow when hovered.

Relaxed

A list can relax its padding to provide more negative space

Divided

A list can show divisions between content

Celled

A list can divide its items into cells

Size

A list can vary in size

Content Variations

Vertically Aligned

An element inside a list can be vertically aligned

Floated

A list, or an element inside a list can be floated left or right

This is the bottom
Blazing deployments by Vercel.